课程
/前端开发
/HTML/CSS
/网页布局基础
黑色盒子与绿色盒子都设置了浮动后，那其父元素为什么会受到了影响？还有那个紫色盒子的是不是为父元素？
2017-02-23
源自：网页布局基础 3-3
正在回答
clear:both只能清除相邻元素（这里特指紧随浮动元素其后的元素）受到的浮动影响；
父级元素收到浮动影响时使用{width：100%；overflow:hidden;}才能清除父级元素受到的浮动影响
qq_聚_0 回复 街角疯 提问者
overflow:hidden 的意思是超出的部分要裁切隐藏掉。那么如果 float 的元素不占普通流位置。
普通流的包含块要根据内容高度裁切隐藏，如果高度是默认值auto，那么不计算其内浮动元素高度就裁切就有可能会裁掉float。所以如果没有明确设定容器高情况下它要计算内容全部高度才能确定在什么位置，hidden浮动的高度就要被计算进去顺带达成了清理浮动的目标。
也可以不设置宽度，要设置具体的宽度必须让宽度能够包裹住浮动起来的子元素，就是比这两个子元素宽（如果两个子元素之间设有margin值或由边框也需要把这些考虑进去 。所以说设为100%方便许多）
举报
让你精通CSS中三大定位机制，彻底掌握网页布局的相关知识
