IE无法正确呈现CSS文本 - 背景剪辑

Question

我的问题是关于IE以及它如何显示我的背景剪辑文本。

通常（chrome / ff / etc）我的代码呈现：

http://i.stack.imgur.com/x9lio.png

然而在IE中，它呈现如下：

http://puu.sh/3kJOx.png

我的代码如下：

HTML ：

<div id="centerArt">
        Hi, Visitor!
    </div>

CSS ：

#centerArt{
font-family:"Arial", Arial, sans-serif;
font-weight: bold;
font-size: 100px;
line-height: 150px;
background-color: #565656;
color: transparent;
text-shadow: 0px 2px 3px rgba(255,255,255,0.3);
 -webkit-background-clip: text;
 -moz-background-clip: text;
      background-clip: text;}

有没有办法让IE表现出来？ ：）

谢谢！

Answer 1

IE中不支持

background-clip: text，有效的属性值仅为border-box，padding-box和content-box：https://msdn.microsoft.com/en-us/library/jj127314(v=vs.85).aspx

您可以尝试将@supports (-webkit-background-clip: text)与其他浏览器一起使用。

Answer 2

IE不支持定义的color: transparent值。尝试使用

font-size: 0;或添加IE hack background:none\9;