css浏览器兼容方法
十一月 27, 2011 | In: 网页
通过条件判断引入样式表
在 IE 浏览器中通过条件注释语句加载指定的不同CSS样式表,而其他非 IE 内核浏览器则自动忽略注释。
<!--[if IE 8]><link rel="stylesheet" href="ie8.css"><![endif]--> <!--[if IE 7]><link rel="stylesheet" href="ie7.css"><![endif]--> <!--[if IE 6]><link rel="stylesheet" href="ie6.css"><![endif]-->
这段代码 IE8、IE7、IE6 会加载各自对应的样式文件。
CSS Hacks
能解决问题但不符合W3C规范
_selector{property:value;} //IE6
*selector{property:value;} //IE6 IE7
selector{property:value\9;} //IE6 IE7 IE8
通过条件判断插入指定类
为不同 IE 版本设置样式的类
<!--[if !IE]><html><![endif]--> // 非 IE 浏览器的情况,不添加任何作用类 <!--[if IE 6]><html class="ie6"><![endif]--> <!--[if IE 7]><html class="ie7"><![endif]--> <!--[if IE 8]><html class="ie8"><![endif]-->
如果要为其他浏览器指定样式,可以为其添加指定的类。
.selector { color: black; }
.ie8 .selector { color: green; } /* IE8 */
.ie7 .selector { color: blue; } /* IE7 */
.ie6 .selector { color: red; } /* IE6 */
以防页面被强制按照低版本的 IE 来渲染,设置渲染模式为标准模式的 X-UA-Compatible:
<meta http-equiv="X-UA-Compatible" content="IE=Edge">//标准 IE 模式