html - IE 11 框阴影比 Chrome/Firefox 更薄

Question

我为 box-shadow 属性应用相同的值，但在 IE11 上，阴影看起来更细，在某些情况下我什至看不到它。

请参阅此 fiddle :http://jsfiddle.net/anhhnt/8pvgZ/2/
这是没有此浏览器的 IE11 的结果:
原始属性值为:

box-shadow: 0px 1px 3px 0px #777;

当我把它变成

box-shadow: 0px 1px 6px 0px #777;

...那么好像还可以，但是为什么会有这个区别呢？解决这个问题的最佳解决方案是什么？提前致谢

Answer 1

发生这种情况是因为每个浏览器都有自己的呈现元素的方式。

真正解决这个问题的最佳方法是使您的页面不依赖于可能因浏览器而异的图形元素(例如 box-shadow)。当我不得不使用 box-shadow 时，我通常会放一个几乎看不见的阴影，带有微妙的边框。它的效果非常好，并且避免了我们通常因浏览器对 box-shadow 属性的解释之间的荒谬差异而遇到的大多数问题。

我做了一个fiddle基于您发布的内容。