以 IE9 或 IE8 为目标,但不能同时使用 CSS
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/5852681/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Target IE9 or IE8 but not both using CSS
提问by Tsundoku
I know it shouldn't be done, but I just want a quick fix for now and that will give me time to find a proper fix for this.
我知道不应该这样做,但我现在只想快速修复,这将使我有时间为此找到合适的修复方法。
How can I target IE8 alone using CSS because I've tried appending \9
such as:
我怎样才能使用 CSS 单独定位 IE8,因为我已经尝试过附加,\9
例如:
margin:100px;
However, it also affects IE9 and I don't want that because on IE9 the whole site looks fine.
但是,它也会影响 IE9,我不希望这样,因为在 IE9 上,整个站点看起来都很好。
回答by Dan
From the HTML5 Boilerplateand originally from Paul Irish:
来自HTML5 Boilerplate和最初来自Paul Irish:
Change your <html>tag to this:
将您的<html>标签更改为:
<!--[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]-->
Then IE8 will add a .ie8 class to the html tag. Same for all the other versions of IE. You can then do:
然后 IE8 会在 html 标签中添加一个 .ie8 类。对于所有其他版本的 IE 也是如此。然后你可以这样做:
.ie8 {
margin:100px;
}
Edit:Removed the no-jsclass, and please update the lang=""attribute to your language. Thanks, eyelidlessness.
编辑:删除了no-js类,请将lang=""属性更新为您的语言。谢谢,眼皮。
回答by xemlock
This should work only in IE9 (and probably newer versions as well):
这应该只适用于 IE9(可能还有更新的版本):
:root #element-id {
margin: 400px;
}
It is because :root
pseudo class is not implemented in versions prior to IE9 (see http://msdn.microsoft.com/en-us/library/cc351024%28v=vs.85%29.aspx).
这是因为:root
在 IE9 之前的版本中没有实现伪类(参见http://msdn.microsoft.com/en-us/library/cc351024%28v=vs.85%29.aspx)。
回答by Selvamani
You can use root function
您可以使用根函数
:root #element { color:pink \0/IE9; } /* IE9 + IE10pp4 */
:root #element { color:pink \0/IE9; } /* IE9 + IE10pp4 */
hack only on IE
只在 IE 上破解
#element {
color:orange;
}
#element {
*color: white; /* IE6 + 7, doesn't work in IE8/9 as IE7 */
}
#element {
_color: red; /* IE6 */
}
#element {
color: green <!--[if IE 8]> = IE8
<!--[if lt IE 8]> = IE7 or below
<!--[if gte IE 8]> = greater than or equal to IE8
/IE8+9; /* IE8 + 9 + IE10pp4 */
}
:root #element { color:pink <!--[if IE 8]>
<style type="text/css">
/* css for IE 8 */
</style>
<![endif]-->
<!--[if lt IE 8]>
<link href="ie7.css" rel="stylesheet" type="text/css" />
<![endif]-->
/IE9; } /* IE9 + IE10pp4 */
回答by Sri
There is three ways to do this,
有三种方法可以做到这一点
IE Conditional Comments
IE 条件注释
IE conditional comment is probably the most commonly used to fix the IE bugs for specific versions (IE6, IE7, IE8). Below are some sample code to target different versions of Internet Explorer:
IE 条件注释可能是最常用于修复特定版本(IE6、IE7、IE8)的 IE 错误的。下面是一些针对不同版本 Internet Explorer 的示例代码:
IE8 or below: to write CSS rules specificially to IE8 or below, add a backslash and 9 () at the end before the semicolon.
IE7 or below: add an asterisk (*) before the CSS property.
IE6: add an underscore (_) before the property.
.box {
background: gray; /* standard */
background: pink; /* IE 8 and below */
*background: green; /* IE 7 and below */
_background: blue; /* IE 6 */
}
<!--[if lt IE 7 ]> <html class="ie6"> <![endif]-->
<!--[if IE 7 ]> <html class="ie7"> <![endif]-->
<!--[if IE 8 ]> <html class="ie8"> <![endif]-->
<!--[if IE 9 ]> <html class="ie9"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--> <html> <!--<![endif]-->
CSS Rules Specific to Explorer (IE CSS hacks)
特定于资源管理器的 CSS 规则(IE CSS hacks)
Another option is to declare CSS rules that can only be read by Explorer. For example, add an asterisk (*) before the CSS property will target IE7 or add an underscore before the property will target IE6. However, this method is not recommended because they are not valid CSS syntax.
另一种选择是声明只能由资源管理器读取的 CSS 规则。例如,在 CSS 属性面向 IE7 之前添加星号 (*) 或在属性面向 IE6 之前添加下划线。但是,不建议使用此方法,因为它们不是有效的 CSS 语法。
##代码##Conditional HTML Class
条件 HTML 类
The third option, which was founded by Paul Irish, is to add an CSS class with the IE version to the HTML tag by using IE conditional comments. Basicially, it checks if it is IE, then add a class to the html tag. So to target specific IE version, simply use the IE class as the parent selector (eg. .ie6 .box). This is a clever way and it doesn't cause any validation errors.
第三种选择是由 Paul Irish 创立,是通过使用 IE 条件注释将带有 IE 版本的 CSS 类添加到 HTML 标签中。基本上,它会检查它是否是 IE,然后在 html 标签中添加一个类。因此,要针对特定的 IE 版本,只需使用 IE 类作为父选择器(例如 .ie6 .box)。这是一个聪明的方法,它不会导致任何验证错误。
##代码##