您的位置:首页 > Web前端 > CSS

HTML和CSS中如何判断ie各版本浏览器

2014-01-16 17:05 513 查看
在编写网页代码时,经常遇到的就是兼容性问题,尤其ie6,让很多人头疼,各种浏览器的兼容性是个必须考虑的问题,有些时候无法找到适合所有浏览器的写法,就只能写根据浏览器种类区别的代码,这时就要用到判断代码了。而区分浏览器分为两种情况,一种是html代码,一种是css代码,经常用到!

当然另外一直办法就是直接用js判断,请见我的另外一篇文章:js判断浏览器类型及版本详细分析 (js判断ie6)

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

123456<!–[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]–>
以上这些代码写法都是针对ie各版本浏览器的,在其他浏览器中这些代码都会被解释为Html注释而直接无视掉,所以要想些针对firefox之类的非ie浏览器,需要这么写:

1

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

—————————————————分割线———————————————————

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

123456.classname{background:blue; /*Firefox等非IE浏览器背景变蓝色*/background:red \9; /*IE8 背景变红色*/*background:black; /*IE7 背景变黑色*/_background:orange; /*IE6 背景变橘色*/}
类似的还有:

1

2

3

4

.classname
{

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

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

}

因为其他浏览器可读取「!important;」但IE6却不行。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: