• 清除浮动的几种方法


    1 加一个清除浮动的<div>,推荐

    <div class="all">
    <div class="a"></div>
    <div class="b"></div>
    <div class="clear"></div>
    .all
    {
    100%;
    height:auto
    .a{
    float:left;
    }
    .b{
    float:right;
    }
    .clear{
    clear:both;
    }

    2 父元素也写成float:left;。但会影响其他元素的表现

    3 父元素:overflow:hidden;zoom:1;

    4 结合使用:after伪类和内容声明在指定的现有内容的末尾添加新的内容:

    .clear:after {
    
     content:".";
    
     height:0;
    
     visibility:hidden;
    
     display:block;
    
     clear:both;
    
    }
    
    <div class="all clear">

    这个方法在大多数现代浏览器中都是有效的,淘宝首页也用了这种方式来清除浮动,但是在win/IE6和更低版本中不起作用。

    在区分Win和Mac中Internet Explorer的诸多方法中,最常用就是Holly招数。Holly招数的原理是这样的,CSS代码

    1. /* 这段代码只有IE/Win可以看见 */  
    2. CSS 规则  
    3. /* 结束Hack */  

    上面的代码中有两行注释,其中第一行结束时出现了反斜杠(),在Mac的Internet Explorer中会认为注释并没有结束,于是继续向下直到第一个完事的“*/”出现,这中间的所有字符都被当作是注释,而IE/Win却只会把第一行 和第三行看作是注释,中间的为有效代码。所以这样就区分出来了不同平台上的IE了。

    正是基于以上原理,在windows的IE 6上的清理浮动,可以使用如下代码:

    .all{
    display:inline-block;
    }
    /*Holly Hack Begine*/
    *html .all{
    height:1%;
    }
    .all{
    display:block;
    }
    /*end Hack*/

      参考:http://www.cnblogs.com/yuzhongwusan/archive/2008/06/18/1224383.html

  • 相关阅读:
    Tomcat在Linux下的安装与配置
    Intel S5000VSA(SAS)主板设置RAID 步骤【转】
    eclipse 安装Subversion1.82(SVN)插件
    shell脚本分析nginx日志
    shell脚本抓取网页信息
    shell脚本备份日志
    电力项目十一--js添加浮动框
    电力项目五--主界面分析
    This function has none of DETERMINISTIC, NO SQL
    mysql导入数据失败:mysql max_allowed_packet 设置过小
  • 原文地址:https://www.cnblogs.com/Zoe-only/p/4619453.html
Copyright © 2020-2023  润新知