CSS Hack

      说到浏览器兼容性问题,就必须说CSS Hack!
 
      在CSS中,Hack是指一种兼容CSS在不一样浏览器中正确显示的技巧方法。说的更直白一些就是,你平时作个页面,布局正确,CSS正确,可就是在不一样的浏览器中显示的效果不同,要么错位,要么多几个像素,怎么都找不到缘由,这时候咱们就会用一些技巧方法来让不一样的浏览器显示同样的效果,这种方法咱们就称之为CSS Hack。
     CSS Hack是经过不一样的标记来区分不一样的浏览器。
 
①!important 做用:用来解决一些在IE6上显示的效果与IE7/IE8/IE9/FireFox上的效果不同的状况。好比有下面的一段代码:
#content{
     height:960px !important;
     height:900px;
}

IE7/IE8/IE9/FireFox能够识别上面附加"!important"的语句,看到附加"!important"的语句后,就不会再去执行第二句,尽管他们也“认识”第二句,可是附加"!important"的语句拥有绝对优先级,只要有它存在,第二句就不容许执行。附加“!important”语句IE6没法识别,因此IE6会跳过附加“!important”的语句直接去执行第二句“height:900px”,第一句在IE6看来就是不存在的语句。

      利用浏览器对加了"!important"语句的识别能力,来解决一些在IE6上显示的效果与IE7/IE8/IE9/FireFox上的效果不同的状况。浏览器


②*(星号)

做用:用来解决一些在IE6/IE7上显示的效果与IE8/IE9/FireFox上的效果不同的状况。好比有下面的一段代码:
#content{
     height:960px;
    *height:900px;
}

IE8/IE9/FireFox不能识别附加有*的CSS属性语句,因此IE8/IE9/FireFox只能读第一句“height:960px;”而忽略第二句,IE6/IE7能够识别附加有*的CSS属性语句,也就是说第一句和第二句都认识,因此它们先读第一句,将高度定为960px,然后又读第二句“*height:900px;”,将高度从960px修改成900px,因此咱们在IE中看到的最终效果就是高度为900px;布局


       利用浏览器对加了“*”语句的识别能力,来解决一些在IE6/IE7上显示的效果与IE8/IE9/FireFox上的效果不同的状况。
 
 
补充:

IE6能识别下划线"_"和星号" * ",IE7能识别星号" * ",但不能识别下划线"_",IE8能识别" \9",但不能识别下划线"_",而firefox两个都不能认识,却能够识别‘!important’.spa

相关文章
相关标签/搜索
本站公众号
   欢迎关注本站公众号,获取更多信息