1，浮动的元素不能给标准流的父亲撑出高度，怎么办？
标准流的元素只能被标准流的儿子撑出高度
2，偏方overflow，解决该问题的方法一
overflow:hidden|auto|sreoll;
overflow本身是管理溢出内容的
但是这个属性不但能管理溢出，还能让父元素被浮动的子元素撑出高度，也就是说父元素设置了这个属性，就能被浮动的儿子撑出高度
3，如果父元素设置了高度，能够管住浮动的儿子
有高度的盒子能够管住浮动的儿子不去影响其他的盒子，也不会被其他盒子影响
4，清除浮动方法
clear:both;
clear:both|left|right;
清除全部浮动|清除左浮动|清除右浮动
margin设置：浮动元素设置margin就去找浮动元素，标准流设置margin去找标准流
这个东西不好用，尽可能不用：
1）父盒子依旧没有高度
2）margin基本算是废了（失效状态）
5，清除浮动方法2：隔墙法
很有用，经常用在页面大块与大块之间，小块之间还是有一定问题
隔墙法：使得被隔离的两个部分互不影响，但是两个部分依旧没有高度，margin依旧处于失效状态，但是我们可以使用墙来模拟margin
6，清除浮动方法3：内墙法
这种情况，margin好使了，高度也有了，浮动互不影响，所有的问题都能解决
但是内墙法使用的html标签太多，并且这些标签没有语义，看起来不爽，所以内墙法使用的也不多
7，清除浮动方法4：伪元素法
其实和内墙法一样，但是没有标签，使用伪元素替代标签
8，清除浮动方法5：overflow:hidden;
溢出隐藏
总结：
清除浮动的方法很多，但是很多都只存在于传说与面试当中
工作过程中：
1）我们喜欢清除浮动使用overflow:hidden;
2）在页面布局时大块之间我们也会使用外墙法
感觉有帮助的点个喜欢💗
网友评论