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

html-css018

HTML和CSS中如何判断ie各版本浏览器的方法,第1张

html中区分ie各版本的方法为IE有条件注释,不过这种方式只支持到IE9(包括IE9),在IE10之后移除了该特性;不建议使用;

css中判断IE各版本,只能通过css hack方式,针对浏览器的怪癖行为来区分;不建议使用;

通过js处理浏览器的用户代理userAgent字符串来解析出浏览器的版本,虽然这种方式也不建议使用,但是目前能解析出浏览器类型及版本最好的办法了

function myBrowser(){

var userAgent = navigator.userAgent//取得浏览器的userAgent字符串

var isOpera = userAgent.indexOf("Opera") >-1

if (isOpera) {

return "Opera"

}//判断是否Opera浏览器

if (userAgent.indexOf("Firefox") >-1) {

return "FF"

} //判断是否Firefox浏览器

if (userAgent.indexOf("Chrome") >-1){

return "Chrome"

}

if (userAgent.indexOf("Safari") >-1) {

return "Safari"

} //判断是否Safari浏览器

if (userAgent.indexOf("compatible") >-1 &&userAgent.indexOf("MSIE") >-1 &&!isOpera) {

return "IE"

}//判断是否IE浏览器

}

//以下是调用上面的函数

var mb = myBrowser()

if ("IE" == mb) {

alert("我是 IE")

}

if ("FF" == mb) {

alert("我是 Firefox")

}

if ("Chrome" == mb) {

alert("我是 Chrome")

}

if ("Opera" == mb) {

alert("我是 Opera")

}

if ("Safari" == mb) {

alert("我是 Safari")

}

如果需要判断浏览器的版本再说

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

<!--[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注释而直接无视掉。

<body>

<!--[if IE 6]>

<div>

IE6中才可以看到

</div>

<![endif]-->

<div>

其他

</div>

</body>

所以要想些针对firefox之类的非ie浏览器,需要这么写:<!--[if !IE]><!-->除IE外都可识别<!--<![endif]-->