• CSS hack


    针对不同的浏览器写出的CSS code就称为CSS hack.

    1.HTML头部针对不同浏览器不同引入或语句

    <!– 默认先调用正常的样式表 –>
    <link rel="stylesheet" type="text/css" href="css.css" />
    <!–[if lte IE 6]>
    <!– 如果IE浏览器版本小于等于6,调用ie.css样式表 –>
    <link rel="stylesheet" type="text/css" href="ie.css" />
    <![endif]–>

    lte:就是Less than or equal to的简写,也就是小于或等于的意思。

    lt :就是Less than的简写,也就是小于的意思。

    gte:就是Greater than or equal to的简写,也就是大于或等于的意思。

    gt :就是Greater than的简写,也就是大于的意思。

    ! :就是不等于的意思,跟javascript里的不等于判断符相同。

     

    2.CSS3中常针对不同的浏览器内核添加不同的前缀(W3C标准的放置最后)

    -moz-transform: rotate | scale | skew | translate ;  /*Mozilla内核浏览器:firefox3.5+*/
    -webkit-transform: rotate | scale | skew | translate ;  /*Webkit内核浏览器:Safari and Chrome*/
    -o-transform: rotate | scale | skew | translate ;     /*Opera*/
    -ms-transform: rotate | scale | skew | translate ;  /*IE9*/
    transform: rotate | scale | skew | translate ;  /*W3C标准*/

    3.针对IE系列不同的浏览器有针对的属性前缀或后缀 (针对所有浏览器的样式要放在最前面,越特殊的越靠后,和上面有有区别)

    前缀

    后缀

    IE6

    IE7

    IE8

    IE9

    IE10

    现代浏览器

    -

     

     

     

     

     

     

    +

     

     

     

     

     

     

    *

     

     

     

     

     

     

    9

     

     

     

     

     

     

     

     

     

    9

     

     

    !important

     

    例如:

    background-color:blue;        /*所有浏览器*/
    background-color:red9;       /*所有的ie*/
    background-color:yellow;   /* ie8+*/
    +background-color:pink;       /*+ ie7*/

    4.针对IE系列不同浏览器的选择器,(不常用)

     

    IE6

    IE7

    IE8

    IE9

    IE10

    *html

           

    *+html

     

         

    :root

         

     

    例如:

    :root .test               /*只有IE9能识别*/
    {
        background-color:green;
    }

    参考链接:http://www.cnblogs.com/dolphinX/p/3292630.html

  • 相关阅读:
    等待事件统计信息--Wait Events Statistics
    实时监控SQL
    PHP中常用的魔术方法
    PHP生成缩略图(3)--封装类
    PHP生成缩略图(2)--等比缩略图
    PHP生成缩略图(1)--简单缩略图
    调用天气预报接口
    使用JSON实现分页
    使用AJAX实现分页
    AJAX缓存问题
  • 原文地址:https://www.cnblogs.com/Peng2014/p/4644116.html
Copyright © 2020-2023  润新知