Question

通常情况下，我不打扰不同浏览器中框阴影渲染的细微差别，但在这种情况下，框阴影大小非常重要。 IE9和IE10呈现smaller box-shadow。可以使用条件注释使用更大的框阴影修复资源管理器9，但IE10似乎已取消对条件注释的支持。有没有办法纠正IE10盒子阴影的大小，并使它像Safari，chrome，firefox一样大？

我知道它与this question有点类似，但也许有人有机箱阴影大小的技巧，只适用于IE9 / 10或IE10。

对于记录 - 这是一个响应式网站，有问题的盒子阴影应用于宽度为百分比的li元素（用于导航）

Answer 1

我找到了解决方案。有几个ie10 hacks，但这个是CSS only并且同时针对IE9和IE10。它被称为@media Zero Hack。您可以在http://www.impressivewebs.com/ie10-css-hacks/

找到这个和其他ie10黑客

.navigation ul li a {
  -moz-box-shadow: 2px 2px 7px #2d231c;
  -webkit-box-shadow: 2px 2px 7px #2d231c;
  -o-box-shadow: 2px 2px 7px #2d231c;
  box-shadow: 2px 2px 7px #2d231c;
}
@media screen and (min-width:0\0) {
    /* IE9 and IE10 rule sets go here */
.navigation ul li a {
  box-shadow: 2px 2px 15px #3a312a;
 }
}

它使用IE9/10中的解析错误。如果在IE11中修复了此错误，这也将是未来的证据。我不知道IE11将如何处理box-shadow。更多关于moving IE specific CSS into @media blocks

Internet Explorer 10盒阴影大小

1 个答案: