''清除浮动''与解决''外边距塌陷''两大问题

清除浮动

什么时候要清除浮动？

在父级没有高度时，子盒子浮动，影响下方布局（因为浮动完后时不占用标准流位置的，所以父级认为伍内容就没有了高度）

 

清除浮动的本质：

解决父元素因为子浮动引起内部高度为0的问题。清除浮动后父盒子会自动检测 子盒子的高度，就不会影响下面的标准流布局了

 

清除浮动的方法：

1 额外标签

2 父级添加overflow属性

3 使用after为元素清除浮动

4 使用双伪元素清除浮动

5 也可固定高度

（根据需求自己选择）

 

外边距塌陷

这里说的外边距塌陷都是指上边距，例如

 子盒子加magin-top就会照成两个盒子一起往下移动，而不是子盒子相对父盒子向下移动

解决办法：

1 父盒子加overflow: hidden;

2 父盒子加边框

3 子盒子有浮动或绝对定位或固定定位或父盒子有绝对定位或固定定位（固定定位可以理解成特殊的绝对定位，两个都是不占位置，只是固定定位的父亲是浏览器）

（不用magin-top直接用padding也行可以同样效果）