| 浮动:最早期做图文排版的 | |
|---|---|
| 让块元素同行显示 | |
| html中块元素有自己排列规则,独占一行 | |
| 浮动元素会脱离文档流 | |
| 一旦有浮动,就会产生问题,一定要清除浮动 | |
| 清除浮动的方法: | |
| 1.给受到浮动影响的元素添加overflow:hidden - 因为overflow属性会触发 BFC |
|* BFC: block formatting context 块级格式化上下文* - 让元素强制按照块元素的规则进行排列 |
| | 2.在受到浮动影响的元素前面,添加一个空div,给空div添加样式:clear:both | | | 3.在浮动元素的父标签的伪元素选择器:after中清除浮动 - 类似于空div
| .box:after{ | |
|---|---|
| content: ""; | |
| display: block; | |
| clear: both; | |
| } |