发表于： 2017-03-31 22:06:41
4 672
今天完成的事情：
做了任务八第一个页面的一半。
明天计划的事情：完成任务八，也相当于完成任务九的第一个页面
遇到的问题：
这个地方展开过后不会把下面的内容挤下去。百思不得其解。在问了同学过后才发现是因为我的导航栏部分固定了高度。展开过后高度还是会坍塌。
将宽度改为用padding撑开。不设置height值。
收获：下面部分的布局基本都是试用的boostrap框架的栅格。对栅格有深入的理解了。
折叠是元素与元素间相互的行为，不存在 A 和 B 折叠，B 没有和 A 折叠的现象。一个元素的 margin-top 会和它普通流中的第一个子元素(非浮动元素等)的 margin-top 相邻；只有在一个元素的 height 是 "auto" 的情况下，它的 margin-bottom 才会和它普通流中的最后一个子元素(非浮动元素等)的 margin-bottom 相邻。
只有垂直方向的 margin 才会折叠，也就是说，水平方向的 margin 不会发生折叠的现象。
那么如何使元素上下margin不折叠呢？
1.浮动元素、inline-block 元素、绝对定位元素的 margin 不会和垂直方向上其他元素的 margin 折叠
2.创建了块级格式化上下文的元素，不和它的子元素发生 margin 折叠。
返回列表
评论