float

• 浮动的本质是为了实现文字环绕效果

• 作用机制 是破坏文档流

特性

• 包裹性

• 块状化并格式化上下文

• 破坏文档流

• 没有任何 margin 合并

• 行框盒子和浮动元素的不可重叠性，实现环绕效果的条件

清除浮动 clear

• 元素盒子的边 不能和前面的浮动元素相邻

clear: none | left | rigth | both

• clear 属性只有块级元素才有效，而 ::after 等伪元素默认都是内联元素，所以借助伪元素清除浮动时需要设置 display