19

由于 IE 在版本 10 中摆脱了条件注释,我迫切需要找到专门针对 IE10 的“CSS hack”。请注意,它必须是“被黑”的选择器,而不是 CSS 属性。

在 Mozilla 中,您可以使用:

@-moz-document url-prefix() {
  h1 {
    color: red;
  }
}

在 Webkit 中,您通常会:

@media screen and (-webkit-min-device-pixel-ratio:0) {
  h1 {
    color: blue;
  }
}

我将如何在 IE10 中做类似的事情?

4

4 回答 4

33

以下示例显示了如何执行此操作

/* 
 #ie10 will only be red in MSIE 10, 
 both in high contrast (display setting) and default mode 
*/
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
   #ie10 { color: red; }
}

警告:也可能在 IE11+ 中工作。

于 2012-11-06T15:39:31.563 回答
5

使用来自http://rafael.adm.br/css_browser_selector/的 css 浏览器选择器,您可以在代码中添加一个简单的 + 并从您的 CSS 中调用 IE10。

查找/msie\s(\d)/并将其更改为/msie\s(\d+)/.

现在在您的 CSS 中,只需.ie10在您的选择器之前添加,如下所示:

.ie10 .class-name { width: 100px; }
.class-name { width: 90px; }

您现在应该看到 IE10 呈现 100px 宽度,而所有其他浏览器呈现 90px 宽度。

于 2012-12-13T22:43:13.320 回答
3

据我所知,不存在这样的 CSS 选择器。如果你想专门针对 IE10,为什么不写一点 javascript 在body名为 的元素上设置一个类ie10,然后为 IE10 创建一个特定的样式?

于 2011-09-06T14:04:32.093 回答
2

我不确定这是否符合您的选择器与属性要求,但我在尝试text-shadow在 IE7-9 中伪造然后在 IE10 中关闭黑客时想出了以下方法。关键是要使用IE10中的新-ms-animation东西。

.header {
    /* For browsers that support it to add a little more punch to a @font-face */
    text-shadow: rgba(100, 100, 100, 0.5) 0 0 2px;

    /* Make IE7-9 do faux bold instead and then turn down the opacity to match */
    *font-weight: bold;
    font-weight: bold\9;
    *filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=75);
    opacity: 0.75\9;

    /* Uh oh! We've also caught IE10 in our above hack */

    /* But IE10 supports CSS3 animations. Will a high duration keep CPU usage down? */
    -ms-animation: text-shadow 60s infinite;
}

/* Define the animation */
@-ms-keyframes text-shadow {
    0%, 100% {
        font-weight: normal;
        opacity: 1;
    }
}
于 2012-03-13T11:21:00.100 回答