[1] IE条件下注释IE条件注释在IE5/Win中首次出现,并且得到了Windows浏览器的所有后续版本的支持.
<!--[if IE] /*所有IE*/
<style type="text/css">@import("ie.css")</style>
-->
---------------------------------------------------------
<!--[if gte IE 5.5000] /*IE5.5和更高版本*/
<style type="text/css">@import("ie5xup.css")</style>
-->
---------------------------------------------------------
<!--[if lt IE 6] /*IE5和IE5.5*/
<style type="text/css">@import("ie5x.css")</style>
-->
[2] 子选择器过滤器这个过滤器依赖于没有实现的CSS,而不是浏览器Bug.IE5-6/Win不支持子选择器,所以会隐藏规则,对于IE7和FireFox是支持的.
html>body { background-image:url(ba.png); }
[3]属性选择器过滤器许多现代浏览器都支持属性选择器,但是IE5-6不支持,所以可以使用属性选择器在比较高级的浏览器中对类和ID应用样式.
div[id="content"] { background-image:url(bg.png) ;}
[4]星号HTML过滤器在IE6和更低版本中有一个匿名根元素,它包围着HTML元素,可以用通用选择器指定包围在另一个元素中的HTML元素。所以可用它将特定的规则应用到这些浏览器中。
* html { font-size:small; }
[5]反斜杠过滤器Mac上的IE5允许在注释内部进行转义,其工作方法是在结束注释字符之前加一个反斜线,所有的浏览器都会忽略这个转义,并且应用后面的样式,IE5/Mac认为注释还没有结束,因此会把下一个结束注释字符串前的所有字符都忽略。
/* Hiding from IE5/Mac \*/
#nav a { width:5em; }
/*End Hack*/
结合前面的星号HTML过滤器,就可以对Windows上的IE6和更低版本应用样式。
/* Hiding from IE5/Mac \*/
* html { height:2px; }
/*End Hack*/
[6]转义属性过滤器转义属性过滤器提价了一种对IE5.x/Win隐藏样式的方法。IE5.x/Win认为转义字符是属性的一部分,并且它不认识这个属性,所以会忽略这个声明,而所有的现代浏览器不会忽略这个转义字符,会应用这个声明。
#content { w\idth:200px; }
/* 反斜线不能出出在0-9和A-F这些字符之前,这些字符有其它意义*/
[7]框模型过滤器其目的是解决IE的专有框模型问题,这个过滤器将一个宽度传给IE5/Win,将另一个宽度传给所有的现代浏览器。
div.content {
width:400px;voice-family:"\"}\"";
voice-family:inherit;width:300px; }
/*Opera 5也会解析这个Bug,所以会有下面的样式*/
html>body .content { width:300px; }
[8]简化框模型过滤器转义属性过滤器和星号HTML过滤器相结合,就形成了简化框模型过滤器.
* html #content { width:80px;w\idth:100px; }
html #content { width:100px;padding:10px; }
[9]!important和下划线过滤器利用!important和下划线,可以在同一个规则中对IE6和更低版本应用一个规则,对其它所有浏览器应用另一个规则。
#nav { psotion:fixed !important;position:static; }
IE4-6/Win会忽略第一个声明,其它浏览器会应用第一个声明
#nav { position:fixed;_position:static; }
对于现代浏览器不会忽略下划线,将不认识这个属性,会忽略第二个声明 ,应用第一个声明。但是IE4-6/Win会忽略下划线,将认识这个属性,并应用第二个声明。
[10]中括号过滤器这是一种针对FireFox应用样式的一种招数,其它的浏览器将会隐藏样式。
[xmlns] #mydiv { background-color:red;width:100px; }
#mydiv { background-color:blue;width:100px; }
[11]Owen招数Owen招数能够对Opera6IE4-6/Win和更低版本隐藏样式。这个过滤器之所以能够起作用是因为它们都没有实现第一个子选择器。
head:fist-chile+body { padding:10px; }
如果只想针对Opear6各更低版本应用样式,可以结合Owen招数和子选择器招数。
html>body #getFireFox{ display:static; }
head:fist-child+body #getFireFox { display:none; }