清除浮动-白红宇

清除浮动

阅读量：6757 次

发布时间：2019-06-26

本文共 798 字，大约阅读时间需要 2 分钟。

清除浮动的最简写法。\20是一个空白符，没有高度，所以不用加visibility：hidden

.cf:before, .cf:after {
    content: ""; display: table; }.cf:after {
    clear: both; }.cf {
    zoom: 1; }

bootstrap的写法

.clearfix {
    *zoom: 1;}.clearfix:before,.clearfix:after {
   display: table; line-height: 0; content: "";}.clearfix:after {
    clear: both;}

Unicode字符里有一个“零宽度空格”，即，使用这个字符替代content的内容“点”，可以缩减代码量——因为这个字符本身就是不可见的，所以不必再重复使用 visibility:hidden; 来把它藏起来。然后代码就变成了下面这样：

.clearfix:after{
   clear:both;content:"\200B";display:block;height:0;}.clearfix{
   *zoom:1;}

/* For modern browsers */.clearfix:before,.clearfix:after {
       content:"";    display:table;} .clearfix:after {
       clear:both;} /* For IE 6/7 (trigger hasLayout) */.clearfix{
       zoom:1;}

转载于:https://www.cnblogs.com/wannasing/archive/2013/05/16/3082137.html

你可能感兴趣的文章