我继承了一个项目，有些地方简直一团糟。这是其中之一。我需要只针对IE(任何版本)没有改变HTML，没有JavaScript或任何其他技术除了CSS。
#nav li {
float: left;
height: 54px;
background: #4f5151;
display: table;
border-left: 1px solid grey;
}
需要明确的是:在嵌入的样式表中，没有添加ID的或类的标签在html中，我需要应用边界样式，只有当用户使用IE。我该怎么做呢?
编辑:找到了Firefox的解决方案，编辑问题反映了这一点。
当前回答
为了在样式表中只针对IE，我使用这个Sass Mixin:
@mixin ie-only {
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
@content;
}
}
其他回答
为了在样式表中只针对IE，我使用这个Sass Mixin:
@mixin ie-only {
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
@content;
}
}
当使用SASS时，我使用以下2个@media查询来针对IE 6-10和EDGE。
@media screen\9
@import ie_styles
@media screen\0
@import ie_styles
http://keithclark.co.uk/articles/moving-ie-specific-css-into-media-blocks/
Edit
我还使用@support查询(添加尽可能多的你需要的)针对EDGE的后续版本
@supports (-ms-ime-align:auto)
@import ie_styles
@supports (-ms-accelerator:auto)
@import ie_styles
https://jeffclayton.wordpress.com/2015/04/07/css-hacks-for-windows-10-and-spartan-browser-preview/
在经历了使用高对比度模式时网站在边缘上崩溃的问题后，我看到了Jeff Clayton的以下工作:
https://browserstrangeness.github.io/css_hacks.html
这是一个疯狂而奇怪的媒体查询，但这些在Sass中更容易使用:
@media screen and (min-width:0\0) and (min-resolution:+72dpi), \0screen\,screen\9 {
.selector { rule: value };
}
这针对的是IE8以外的IE版本。
或者你可以用:
@media screen\0 {
.selector { rule: value };
}
它针对IE8-11，但也会触发FireFox 1。X(对于我的用例来说，这无关紧要)。
现在我正在测试打印支持，这似乎工作得很好:
@media all\0 {
.selector { rule: value };
}
IE特定样式的另一个工作解决方案是
<html data-useragent="Mozilla/5.0 (compatible; MSIE 10.0; Windows NT 6.2; Trident/6.0)">
然后是选择器
html[data-useragent*='MSIE 10.0'] body .my-class{
margin-left: -0.4em;
}
Internet Explorer 9及以下版本: 您可以使用条件注释为您希望特别针对的任何版本(或版本的组合)加载特定于ie的样式表。如下所示使用外部样式表。
<!--[if IE]>
<link rel="stylesheet" type="text/css" href="all-ie-only.css" />
<![endif]-->
但是，从版本10开始，IE中不再支持条件注释。
Internet Explorer 10和11: 使用-ms-high-contrast创建一个媒体查询，在其中放置IE 10和IE 11特定的CSS样式。因为-ms-high-contrast是微软特有的(只能在IE 10+中使用)，所以只能在Internet Explorer 10及更高版本中解析。
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
/* IE10+ CSS styles go here */
}
Microsoft Edge 12:可以使用@supports规则 这里有一个关于这个规则的所有信息的链接
@supports (-ms-accelerator:true) {
/* IE Edge 12+ CSS styles go here */
}
内联规则IE8检测
我还有一个选项，但它只检测IE8及以下版本。
/* For IE css hack */
margin-top: 10px\9 /* apply to all ie from 8 and below */
*margin-top:10px; /* apply to ie 7 and below */
_margin-top:10px; /* apply to ie 6 and below */
如您为嵌入式样式表所指定的。我认为你需要使用媒体查询和条件评论以下版本。
