.clearfix::after{
content:".";
display:block;
visibility:hidden;
height:0;
clear:both;
}
.clearfix{zoom:1;}
但是对于很多同学这种优化程度代码还是不够给力,clearfix 发展到现在的两个终极版。
终极版一:
- .clearfix:after {
- content:"200B";
- display:block;
- height:0;
- clear:both;
- }
- .clearfix {*zoom:1;}/*IE/7/6*/
解释下:content:"200B";这个参数,Unicode字符里有一个“零宽度空格”,即 U+200B,代替原来的“.”,可以缩减代码量。而且不再使用visibility:hidden。
终极版二:
- .clearfix:before,.clearfix:after{
- content:"";
- display:table;
- }
- .clearfix:after{clear:both;}
- .clearfix{
- *zoom:1;/*IE/7/6*/
- }
这两个终极版代码都很简洁,终极版一和二都可以使用,以上代码都经过测试,大家赶紧用一下吧