internet-explorer - 所有 IE 浏览器中的 CSS3 文本阴影扭曲/像素化（请参见截图）

Question

我只是将文本阴影放在一个元素上，它在除任何 IE 之外的所有浏览器中看起来都很好。

看到文字周围的黑色像素了吗？

color: #68C3C7;
font-family: "Hoefler Text",Baskerville,"Big Caslon","Adobe Garamond Pro",Georgia,Palatino,"Times New Roman",serif;
font-size: 30px;
letter-spacing: 1.2px;
line-height: 30px;
padding: 20px 0 0;
text-align: center;    
text-shadow: 1px 1px 0px #999999;
filter: dropshadow(color=#999999, offx=1, offy=1);

Answer 1

你可以结合使用IE的chroma & drop shadow过滤器。检查这个：http ://www.useragentman.com/blog/2011/04/14/css3-text-shadow-can-it-be-done-in-ie-without-javascript/

这是一些示例代码：

color: #68C3C7;
font-family: "Hoefler Text",Baskerville,"Big Caslon","Adobe Garamond Pro",Georgia,Palatino,"Times New Roman",serif;
font-size: 30px;
letter-spacing: 1.2px;
line-height: 30px;
padding: 20px 0 0;
text-align: center;    
text-shadow: 1px 1px 0px #999999;
background-color: white;
filter: progid:DXImageTransform.Microsoft.Chroma(Color=white)
        progid:DXImageTransform.Microsoft.DropShadow(OffX=1, OffY=1, Color=#99999);

Answer 2

您可能需要为 ie8 提供额外的参数：

.shadow {
/* For IE 8 */
-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000')";
/* For IE 5.5 - 7 */
filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000');

}