CSS笔记 浮动与清除

围住浮动元素的三种方法

1.为父元素添加overflow:hidden

特点： 简单但不太直观
overflow:hidden真正用途是防止包含内容被超大内容撑大，但也有另一个作用：即可靠地使父元素。

2.同时浮动父元素

为父元素添加浮动后，与父元素相邻的元素块需要添加clear:left;
例如：

       section {border:1px solid blue; float:left; width:100%;}
       img {float:left;}
       footer {border:1px solid red; clear:left;}

3.添加非浮动的清除元素

在父元素内容的末尾添加非浮动元素，可以直接在标记中加，也可以通过给父元
素添加clearfix 类来加

.clearfix:after {
content:".";
display:block;
height:0;
visibility:hidden;
clear:both;
}



It's fun to float.

 Here is the footer element…
``