Float的原本作用:文字的环绕效果
包裹
- 收缩
- 坚挺
- 隔绝
具有包裹性的有:display: inline-block / table-cell / overflow: hidden…
破坏
破坏表现为父元素高度塌陷
display:none
position:absolute(近亲)/fixed/sticky
但是!浮动使父元素塌陷其实是标准----因为一开始浮动就是为了实现文字环绕效果
所以常说的清除浮动,应该是清除浮动带来的影响
清除浮动
1.HTML block水平元素底部
2.css after 伪元素底部生成
不知道对不对给我这样的感觉,让父盒子有个支撑物就行啦,所以给父元素.clearfix:after {
content: ‘’;
display: table;
clear:both;
}
也有display:block;好像也可以,不过具体区别我还不知道
无宽度 无图片 无浮动
浮动
- block化
- 去空格化