• .clearfix的用法


    /*用来修正ie6*/
    .clearfix{
    *zoom:1;
    }
    .clearfix:after{
    content:".";
    display:block;
    height:0;
    clear:both;
    overflow:hidden;
    }

    clearfix用在父元素上。But .clearfix:before{}的作用是什么呢?可以不写吗?

    .clearfix:after { 
        visibility: hidden; 
        display: block; 
        font-size: 0; 
        content: " "; 
        clear: both; 
        height: 0; 
    } 
    .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*/ 
    } 

    由此可以看到,.clearfix:before{}的用法可能是指为了content:"";而存在吧?

  • 相关阅读:
    高精度模板_C++
    NOIP总结
    HDU2063_过山车_C++
    手写堆_C++
    NOIP2013Day1解题报告
    [ CodeVS冲杯之路 ] P1368
    POJ1002_487-3279_C++
    [ CodeVS冲杯之路 ] P1092
    POJ2376_Cleaning Shifts_C++
    欧几里得距离_曼哈顿距离_切比雪夫距离
  • 原文地址:https://www.cnblogs.com/nicefuting/p/5311645.html
Copyright © 2020-2023  润新知