浮动
浮动元素会向左/右偏移，直至外边界碰到容器或另一个元素的边缘。 浮动会使得元素脱离文档流，后面元素进行布局时，前面的浮动元素就像不存在一样。
如果右侧没有足够空间，浮动元素就会下坠，直到有足够的空间（折行）。 如果浮动元素有着不同的高度，那么可能在下坠过程中卡在某个位置。
清除浮动
虽然浮动也会使元素脱离文档流，但与绝对定位不同，后续元素仍然会为浮动元素腾出空间。 这可以导致文字环绕的效果，这也是浮动的初衷之一。
如果希望某一行停止环绕，可以为该行设置清除浮动（ clear ）。它有四种值： left , right , both , none ，表示哪个方向不应当与浮动元素相邻。 CSS渲染器通过添加 margin-top 来达到这个效果。例如：
浮动容器
如果你写前端已经有一段时间了，那么一定会发现浮动元素不占据父容器的空间。 这使得父容器大小为零，当然父容器的边框和背景就会失效：
但是有没有发现我们为任何一个元素清除浮动都打不到效果。这时我们需要一个额外的空元素， 并设置 clear:both ：
通过额外的元素我们达到了效果，为此 Bootstrap 可以提供了 clearfix 类。 Bootstrap中这个空元素可以这样写：
查看更多关于利用浮动和清除浮动进行布局_html/css_WEB-ITnose的详细内容...
声明：本文来自网络，不代表【好得很程序员自学网】立场，转载请注明出处：http://haodehen.cn/did114183