如何清除浮动

*学习笔记

---

1. 上下排列结构

    上下排列结构可以使用clear属性清除浮动来解决容器叠加问题。属性值有left、right、both

如：

    

    

    这样两个div就不会重叠了，但box1还是脱离了文档流，相当于在二楼而box2在一楼。

2.嵌套排列结构

    ①固定宽高：不推荐，不能把高度固定死，不适和做自适应的效果。

    ②父元素浮动：不推荐，因为父容器浮动也会影响到后面的元素。

    ③overflow:hidden：(BFC规范)如果有子元素想溢出，那么会受到影响。

    ④display:inline-block：(BFC规范)不推荐，父容器会影响到后面的元素。

    ⑤设置空标签：不推荐，会多添加一个标签。