Question

我正在建立一个网站，我正在使用text-shadow功能，但它不适用于IE。

图形：

text-shadow: 0.1em 0.1em 0.2em black;

是否有任何解决方案或黑客可以解决此问题，或模仿IE的文本阴影功能。

Answer 1

对于某些版本的IE，Dropshadow过滤器可以满足您的需求：

http://msdn.microsoft.com/en-us/library/ms532985%28v=vs.85%29.aspx

Answer 2

我一直在寻找一种跨浏览器的文字笔划解决方案，当覆盖在背景图像上时可以正常工作。我认为我有一个解决方案，不涉及额外的标记，js和IE7-9中的工作（我没有测试6），并且不会导致别名问题。

这是使用CSS3文本阴影which has good support except IE，然后使用IE的过滤器组合的组合。 CSS3文本笔划支持目前很差。

IE过滤器：

发光滤镜looks terrible，所以我没有使用它。

David Hewitt's answer涉及在方向组合中添加阴影滤镜。然后遗憾地删除了ClearType，因此我们最终得到了错误的别名文本。

然后我将useragentman上建议的一些元素与投影阴影过滤器结合起来。

将它们放在一起

此示例为带有白色笔划的黑色文本。我正在使用条件HTML类来定位IE（http://paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/）。

#myelement {
    color: #000000;
    text-shadow:
    -1px -1px 0 #ffffff,  
    1px -1px 0 #ffffff,
    -1px 1px 0 #ffffff,
    1px 1px 0 #ffffff;
}

html.ie7 #myelement,
html.ie8 #myelement,
html.ie9 #myelement {
    background-color: white;
    filter: progid:DXImageTransform.Microsoft.Chroma(color='white') progid:DXImageTransform.Microsoft.Alpha(opacity=100) progid:DXImageTransform.Microsoft.dropshadow(color=#ffffff,offX=1,offY=1) progid:DXImageTransform.Microsoft.dropshadow(color=#ffffff,offX=-1,offY=1) progid:DXImageTransform.Microsoft.dropshadow(color=#ffffff,offX=1,offY=-1) progid:DXImageTransform.Microsoft.dropshadow(color=#ffffff,offX=-1,offY=-1);
    zoom: 1;
}

Answer 3

IE过滤器类也会为您拥有的任何背景图像添加阴影。例如，我有一个H1标签，它有一条线作为背景的一部分，当我打开IE文本阴影滤镜时，背景中的线继承了那个阴影。

Answer 4

我一直在寻找和调查这个问题已经有一段时间了，并希望在IE10上测试我的网站时分享一个可能相互矛盾的发现。

我有这个html结构：

<p>Meer info op onze <a class="links" target="_self" href="/leden">ledenpagina</a></p>

结合CSS：

p { display: inline-table;
    color: #FFF;
    text-shadow: 0px 1px 2px #111, 0px 1px 0px #111;
    margin: 0px 20px; }

a.links {
    text-decoration: underline;
    color: #FFFF60;
    font-size: 1.1em; }

如果我在IE10中看到这个结果，那么achor文本“ledenpagina”确实会收到父（p标签）中定义的文本阴影样式。假设这可能与组合文本修饰有关：下划线选择器是假的（通过在p标签上应用文本修饰来测试）

可以在此处看到结果：http://tczelem.be（向下滑动标题滑块标签）

所以文本修饰选择器似乎在IE10中有一些效果。

！[在此输入图片说明] [2]

IE的文字阴影

4 个答案: