仅在 IE 浏览器中定位元素，我将使用
IE6：
* html #nav li ul {
left: -39px !important;
border: 1px solid red;
}
IE7：
*+html #nav li ul {
left: -39px! important;
}
有谁知道如何定位IE8？
Chris
问问题
150141 次
14 回答
84
我不打算讨论是否应该使用这种方法，但这只会让你为 IE8-9 设置特定的 css 属性（注意：它不是一个选择器，所以和你的有点不同问）：
在每个 css 声明后使用 '\0/'，因此：
#nav li ul {
left: -39px\0/ !important;
}
为了建立另一个答案，您可以这样做以将各种样式分配给 IE6、IE7 和 IE8：
#nav li ul {
*left: -7px !important; /* IE 7 (IE6 also uses this, so put it first) */
_left: -6px !important; /* IE 6 */
left: -8px\0/ !important; /* IE 8-9 */
}
于 2010-09-23T17:40:45.157 回答
74
2013 更新：IE10+ 不再支持条件注释。
原答案：
有些人似乎很困惑，因为这没有回答问题的文字，只有精神 - 所以为了澄清：
没有浏览器选择器之类的东西。有一些黑客可以利用特定浏览器的 CSS 解析器中的错误和/或故障，但依赖这些会导致自己失败。有一种标准的、公认的方法来处理这个问题：
使用条件注释仅针对 IE。
例子：
<!--[if gte IE 8]>
<style>
(your style here)
</style>
<![endif]-->
两者里面的所有内容<!-->都会被所有非IE浏览器作为注释忽略，低于IE8的IE版本会跳过。只有 IE8 和更高版本会处理它。2013 更新： IE10+ 也将忽略它作为评论。
于 2009-03-19T00:37:39.467 回答
26
看看这些：
/* IE8 Standards-Mode Only */
.test { color /*\**/: blue\9 }
/* All IE versions, including IE8 Standards Mode */
.test { color: blue\9 }
于 2009-04-29T20:15:34.170 回答
14
你可以这样使用。这比
<link rel="stylesheet" type="text/css" media="screen" href="css/style.css" />
<!--[if IE 7]><link rel="stylesheet" type="text/css" media="screen" href="css/ie7.css" /><![endif]-->
<!--[if IE 6]><link rel="stylesheet" type="text/css" media="screen" href="css/ie6.css" /><![endif]-->
-------------------------------------------------------------
<!--[if lt IE 7 ]> <body class="ie6"> <![endif]-->
<!--[if IE 7 ]> <body class="ie7"> <![endif]-->
<!--[if IE 8 ]> <body class="ie8"> <![endif]-->
<!--[if !IE]>--> <body> <!--<![endif]-->
div.foo { 颜色：继承；} .ie7 div.foo { 颜色：#ff8000; }
于 2011-10-25T08:55:23.857 回答
11
基于 image72 的出色答案，您实际上可以拥有像这样的高级 CSS 选择器：
<!--[if lt IE 7]><body class="IE IE7down IE8down IE9down IE10down"><![endif]-->
<!--[if IE 7]><body class="IE IE7 IE7down IE8down IE9down IE10down IE7up"><![endif]-->
<!--[if IE 8]><body class="IE IE8 IE8down IE9down IE10down IE7up IE8up"><![endif]-->
<!--[if IE 9]><body class="IE IE9 IE9down IE10down IE7up IE8up IE9up"><![endif]-->
<!--[if gte IE 10]><body class="IE IE10 IE10down IE7up IE8up IE9up IE10up"><![endif]-->
<!--[if !IE]>--><body class="notIE"><!--<![endif]-->
这样在你的CSS中你可以这样做：
.notIE .foo { color: blue; } /* Target all browsers except IE */
.IE9up .foo { color: green; } /* Taget IE equal or greater than 9 */
.IE8 .foo { color: orange; } /* Taget IE 8 only */
.IE7down .foo { color: red; } /* Target IE equal or less than 7 */
.IE8 .foo, .IE9 .foo {
font-size: 1.2em; /* Target IE8 & IE9 only */
}
.bar { background-color: gray; } /* Applies to all browsers, as usual */
/* Maybe show a message only to IE users? */
.notIE #betterBrowser { display: none; } /* Any browser except IE */
.IE #betterBrowser { display: block; } /* All versions of IE */
这很棒，因为：
- 它完全符合标准（没有丑陋/危险的 css hack）
- 无需单独的样式表
- 您可以轻松定位任何版本的 IE 以及复杂的组合
于 2012-04-30T23:25:27.110 回答
11
仅适用于 IE8 的 CSS 样式：
.divLogRight{color:Blue; color:Red\9; *color:Blue;}
只有 IE8 会是红色的。
第一个蓝色：适用于所有浏览器。
红色：仅限 IE6、7、8
第二蓝：仅限 IE6,7
所以红色 = 仅适用于 IE8。
有关浏览器黑客攻击的完整摘要（包括 Internet Explorer (IE)、Safari、Chrome、iPhone 和 Opera），请访问此链接： http: //paulirish.com/2009/browser-specific-css-hacks/
于 2009-10-26T09:23:21.957 回答
11
这个问题很古老，但是..
在开始的身体标签之后..
<!--[if gte IE 8]>
<div id="IE8Body">
<![endif]-->
就在结束正文标签之前..
<!--[if gte IE 8]>
</div>
<![endif]-->
CSS..
#IE8Body #nav li ul {}
您可以使用条件语句对所有 IE 浏览器执行此操作，或者通过使用浏览器名称 + 版本服务器端将所有内容封装在 div 中来定位所有浏览器
于 2010-04-07T21:47:12.083 回答
4
我有一个解决方案，我只在必要时使用，在我构建了有效的 html 和 css 并在大多数浏览器中工作之后，我偶尔会使用来自 Rafael Lima 的这个惊人的 javascript 进行破解。http://rafael.adm.br/css_browser_selector/
它使我的 CSS 和 HTML 保持有效和干净，我知道这不是理想的解决方案，使用 javascript 来修复黑客，但只要你的代码最初尽可能接近（愚蠢的 IE 有时会破坏东西）然后移动一些 px使用 javascript 并没有一些人想象的那么重要。再加上时间/成本的原因，这是一个快速简单的解决方案。
于 2010-09-23T18:37:10.217 回答
4
在 ASP.NET 世界中，我倾向于使用内置的 BrowserCaps 功能将一组类写到 body 标记上，使您能够定位浏览器和平台的任意组合。
所以在预渲染中，我会运行类似这样的代码（假设你给你的标签一个 ID 并让它在服务器上运行）：
HtmlGenericControl _body = (HtmlGenericControl)this.FindControl("pageBody");
_body.Attributes.Add("class", Request.Browser.Platform + " " + Request.Browser.Browser + Request.Browser.MajorVersion);
此代码使您能够在 CSS 中定位特定浏览器，如下所示：
.IE8 #nav ul li { .... }
.IE7 #nav ul li { .... }
.MacPPC.Firefox #nav ul li { .... }
我们创建了 System.Web.UI.MasterPage 的子类，并确保我们所有的母版页都继承自我们专门的 MasterPage，以便每个页面都免费添加这些类。
如果您不在 ASP.NET 环境中，则可以使用 jQuery，它有一个浏览器插件，可以在页面加载时动态添加相似的类名。
这种方法的好处是可以从标记中删除条件注释，并且可以将主要样式和特定于浏览器的样式保留在 CSS 文件中大致相同的位置。这也意味着您的 CSS 更具前瞻性（因为它不依赖于可能修复的错误）并帮助您的 CSS 代码更有意义，因为您只需要查看
.IE8 #container { .... }
代替
* html #container { .... }
或更糟！
于 2009-04-27T12:47:45.230 回答
4
根据不断发展的线程，请参见下文以获得更完整的答案：
即 6
* html .ie6 {property:value;}
或者
.ie6 { _property:value;}
即 7
*+html .ie7 {property:value;}
或者
*:first-child+html .ie7 {property:value;}
IE 6 和 7
@media screen\9 {
.ie67 {property:value;}
}
或者
.ie67 { *property:value;}
或者
.ie67 { #property:value;}
即 6、7 和 8
@media \0screen\,screen\9 {
.ie678 {property:value;}
}
即 8
html>/**/body .ie8 {property:value;}
或者
@media \0screen {
.ie8 {property:value;}
}
仅限 IE 8 标准模式
.ie8 { property /*\**/: value\9 }
即 8,9 和 10
@media screen\0 {
.ie8910 {property:value;}
}
仅限 IE 9
@media screen and (min-width:0) and (min-resolution: .001dpcm) {
// IE9 CSS
.ie9{property:value;}
}
IE 9 及以上
@media screen and (min-width:0) and (min-resolution: +72dpi) {
// IE9+ CSS
.ie9up{property:value;}
}
IE 9 和 10
@media screen and (min-width:0) {
.ie910{property:value;}
}
仅限 IE 10
_:-ms-lang(x), .ie10 { property:value\9; }
IE 10 及以上
_:-ms-lang(x), .ie10up { property:value; }
或者
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
.ie10up{property:value;}
}
IE 11（及更高版本..）
_:-ms-fullscreen, :root .ie11up { property:value; }
Javascript 替代品
现代化
Modernizr 在页面加载时快速运行以检测功能；然后它创建一个带有结果的 JavaScript 对象，并将类添加到 html 元素
用户代理选择
Javascript：
var b = document.documentElement;
b.setAttribute('data-useragent', navigator.userAgent);
b.setAttribute('data-platform', navigator.platform );
b.className += ((!!('ontouchstart' in window) || !!('onmsgesturechange' in window))?' touch':'');
在元素中添加（例如）以下html内容：
data-useragent='Mozilla/5.0 (compatible; MSIE 9.0; Windows NT 6.1; Trident/5.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; .NET4.0C)'
data-platform='Win32'
允许非常有针对性的 CSS 选择器，例如：
html[data-useragent*='Chrome/13.0'] .nav{
background:url(img/radial_grad.png) center bottom no-repeat;
}
脚注
如果可能，请避免浏览器定位。识别并修复您发现的任何问题。支持渐进增强和优雅降级。考虑到这一点，这是一个“理想世界”的场景，并非总是可以在生产环境中获得，因此——上述内容应该有助于提供一些不错的选择。
归因/基本阅读
于 2014-12-05T11:05:57.210 回答
3
我意识到这是一个老问题，但这是我搜索时谷歌上的第一个结果，我认为我找到了比排名最高的建议和 OP 选择做什么更好的解决方案。
#nav li ul:not(.stupidIE) { color:red }
因此，从技术上讲，这与 OP 想要的相反，但这仅意味着您必须先将所需的规则应用于 IE8，然后再将其应用于其他所有内容。当然，您可以在 () 中放置任何内容，只要它是有效的 css，实际上并没有选择任何内容。IE8 在这条线上阻塞并且不应用它，但是以前的 IE（好吧，我只检查了 IE7，我已经不再关心 IE6），只需忽略 :not() 并应用声明。当然，其他所有浏览器（我测试过 Safari 5、Opera 10.5、Firefox 3.6）都像您期望的那样应用该 css。
所以这个解决方案，我想像任何其他纯 CSS 解决方案一样，如果 IE 开发人员添加对 :not 选择器的支持，那么他们还将修复导致您以 IE8 为目标的任何差异。
于 2010-07-07T06:04:13.430 回答
2
好吧，这不是 css hack，而是因为无法找到从 css 定位 ie8 的方法而感到沮丧，并且由于没有 ie 特定 css 文件的政策，我不得不遵循，我假设其他人可能会发现有用：
if (jQuery.browser.version==8.0) {
$(results).css({
'left':'23px',
'top':'-253px'
});
}
于 2009-07-22T16:19:56.360 回答
1
\9 不适用于font-family，相反，您需要使用上面提到的 Chris 的“<em>\0/ !important”，例如：
p { font-family: Arial \0/ !important; }
于 2010-12-29T21:01:25.557 回答
0
IE8 没有任何选择器技巧。这个问题的最佳资源是http://browserhacks.com/#ie
如果你想针对特定的 IE8，你应该在 html 中做评论
<!--[if IE 8]> Internet Explorer 8 <![endif]-->
或者您可以使用属性黑客，例如：
/* IE6, IE7, IE8, but also IE9 in some cases :( */
#diecinueve { color: blue\9; }
/* IE7, IE8 */
#veinte { color/*\**/: blue\9; }
/* IE8, IE9 */
#anotherone {color: blue\0/;} /* must go at the END of all rules */
有关此检查的更多信息：http: //www.paulirish.com/2009/browser-specific-css-hacks/
于 2014-06-21T02:08:05.057 回答