• css常用hack技巧


    1.针对IE的注释语句:lt,gt,lte,gte分别是小于,大于,小于等于,大于等于。注意,注释时,IE 和其对应的浏览器版本中间有空格。

    <!--[if lt IE 9]>
    <link href="http://www.cnblogs.com/src/main/webapp/assets/styles/ieHack.css" rel="stylesheet" type="text/css" />
    <![endif]-->

    2._property:这个只有IE6可以识别,非常有用。

    body { _border:1px solid red; /*only for IE6*/}

    3.*property:IE6,7都识别:

    .box { display:inline-block; *display:inline;*zoom:1; /*for IE6,7*/}

    4.选择器hack:

    * html .box { color:red; /*only for IE6*/ }
    *+html .box { color:red;/*only for IE7*/ }

    以上hack都是针对IE的,IE8,9的hack不稳定,所以此处不介绍。

    更具体的css hack 详见:css浏览器hack 或者本人建立的映射(http://jsfiddle.net/xmlovecss/D8eJn/

    此处提出一个问题,请考虑,如果需要针对所有浏览器设置box宽度,而对IE6不设置宽度,如何去写hack?使用高级选择器即可。

    答案参考如下:

    html>body .box { width:200px; }

    而这么写,就很坑爹了:

    .box { width:200px;_width:auto; }

    另外,使用条件注释语句,并把全局针对IE的hack整理成css文件,是推荐的做法。(但是,这里存在一个问题,当某天,我不需要支持IE6时候,我得一个一个页面的去掉IE条件注释)

    对于私有页面的样式,修复IE bug则不必使用IE注释语句。

    hack会让css变得不干净,给后期维护清理带来麻烦。能不用hack就尽量不用hack。

    规避hack技巧:

    • 尝试使用其它css解决方案
    • 更换html结构

    更全面的browser hack list: http://browserhacks.com/

  • 相关阅读:
    java8 lambda表达式的使用
    关键字 static 静态
    关键字 enum 枚举
    关键字:final 最终的不可被改变的
    关键字 abstract 抽象
    Java中的关键字汇总(50个)
    关键字 assert 断言
    关键字 instanceof 实例
    java8新特性
    docker update restart=always container
  • 原文地址:https://www.cnblogs.com/my_front_research/p/2849879.html
Copyright © 2020-2023  润新知