如何使用有效的 CSS 定位 IE7 和 IE8? [英] How does one target IE7 and IE8 with valid CSS?
问题描述
我想使用符合 W3C 的 CSS 来定位 IE7 和 IE8.有时,为一个版本修复 CSS 并不能为另一个版本修复.我怎样才能做到这一点?
I want to target IE7 and IE8 with W3C-compliant CSS. Sometimes fixing CSS for one version does not fix for the other. How can I achieve this?
推荐答案
Explicitly Target IE versions without hacks using HTML and CSS
如果您不想在 CSS 中进行黑客攻击,请使用此方法.向 <html>
元素添加浏览器唯一的类,以便您以后可以根据浏览器进行选择.
Use this approach if you don't want hacks in your CSS. Add a browser-unique class to the <html>
element so you can select based on browser later.
示例
<!doctype html>
<!--[if IE]><![endif]-->
<!--[if lt IE 7 ]> <html lang="en" class="ie6"> <![endif]-->
<!--[if IE 7 ]> <html lang="en" class="ie7"> <![endif]-->
<!--[if IE 8 ]> <html lang="en" class="ie8"> <![endif]-->
<!--[if IE 9 ]> <html lang="en" class="ie9"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--><html lang="en"><!--<![endif]-->
<head></head>
<body></body>
</html>
然后在您的 CSS 中,您可以非常严格地访问您的目标浏览器.
Then in your CSS you can very strictly access your target browser.
示例
.ie6 body {
border:1px solid red;
}
.ie7 body {
border:1px solid blue;
}
有关更多信息,请查看 http://html5boilerplate.com/
For more information check out http://html5boilerplate.com/
使用 CSSHacks"定位 IE 版本
更重要的是,这里有一些可让您定位 IE 版本的技巧.
More to your point, here are the hacks that let you target IE versions.
使用9"来定位 IE8 及以下.
使用*"来定位 IE7 及以下.
使用_"定位到 IE6.
Use "9" to target IE8 and below.
Use "*" to target IE7 and below.
Use "_" to target IE6.
示例:
body {
border:1px solid red; /* standard */
border:1px solid blue9; /* IE8 and below */
*border:1px solid orange; /* IE7 and below */
_border:1px solid blue; /* IE6 */
}
更新:面向 IE10
IE10 无法识别条件语句,因此您可以使用它来将ie10"类应用到 元素
IE10 does not recognize the conditional statements so you can use this to apply an "ie10" class to the <html>
element
<!doctype html>
<html lang="en">
<!--[if !IE]><!--><script>if (/*@cc_on!@*/false) {document.documentElement.className+=' ie10';}</script><!--<![endif]-->
<head></head>
<body></body>
</html>
这篇关于如何使用有效的 CSS 定位 IE7 和 IE8?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!