html+css判断各个IE浏览器版本

html+css判断各个IE浏览器版本

在编写网页代码时，各种浏览器的兼容性是个必须考虑的问题，有些时候无法找到适合所有浏览器的写法，就只能写根据浏览器种类区别的代码，这时就要用到判断代码了。

在HTML代码中，区别各种浏览器的代码如下(以ie6为例，这时目前国内用户最多的，得益于盗版xp系统的广泛流传….不过这玩意也是绝大部分兼容性问题的根源，因为其标准化程度实在是….)：

<!--[if IE 6]> 仅IE6可识别 <![endif]-->

<!--[if lte IE 6]> IE6及其以下版本可识别 <![endif]-->

<!--[if lt IE 6]> IE6以下版本可识别 <![endif]-->

<!--[if gte IE 6]> IE6及其以上版本可识别 <![endif]-->

<!--[if gt IE 6]> IE6以上版本可识别 <![endif]-->

<!--[if IE]> 所有的IE可识别 <![endif]-->

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

lt ：就是Less than的简写，也就是小于的意思。

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

gt ：就是Greater than的简写，也就是大于的意思。

! ：就是不等于的意思，跟javascript里的不等于判断符相同

以上这些代码写法都是针对ie各版本浏览器的，在其他浏览器中这些代码都会被解释为Html注释而直接无视掉，所以要想些针对firefox之类的非ie浏览器，需要这么写：

<!–[if !IE]><!–> 除IE外都可识别 <!–<![endif]–>

—————————————————————————————————————————————

CSS代码中，则可以根据各浏览器自己独立的可识别的特殊代码来编写区分浏览器的代码，例如为IE系列浏览器可读[\9]，而IE6和IE7可读[*]，另外IE6可辨识[ _ ](下划线)；由于CSS读取时是按从上到下来的，同样属性靠后写的生效，因此可以依照顺序写下来，就会让每个浏览器正确的读取到自己看得懂得CSS语法，有效区分各类型或版本：

.classname{

background:blue; /*Firefox等非IE浏览器背景变蓝色*/

background:red \9; /*IE8 背景变红色*/

*background:black; /*IE7 背景变黑色*/

_background:orange; /*IE6 背景变橘色*/

}

类似的还有：

.classname {

background:black !important; /*非IE6 背景变黑色*/

background:orange; /*IE6 背景变橘色*/

}

解释下!important属性：!important意思是将该css样式提权，优先级别加高，而只有IE6以上版本才支持这个属性，所有可以用来区别IE6与其他版本的IE。