Question

我正在寻找一种方法来获得看起来像css3 text-shadow的文本阴影，但这适用于IE，Firefox，Opera，Safari等...我发现的解决方案看起来搞砸了或者没有在IE中看起来一致。感谢

http://www.workingwith.me.uk/articles/css/cross-browser-drop-shadows

.shadow {
    height: 1em;
    filter: Shadow(Color=#666666,   
            Direction=135, 
            Strength=5);
}

这对我不起作用......在IE中

ul.dropdown a.selected-l {
    background-image: url('Images/Navigation/Left_round/hoverL.png');
    height: 50px;
    width: 130px;
    font-family: Cambria, Cochin, Georgia, Times, "Times New Roman", serif;
    font-size: large;
    color: #FFFFFF;
    text-align: center;
    text-decoration: none;
    line-height: 50px;
    vertical-align: middle;

/* pretty browsers*/
        text-shadow:#000 0px 0px 5px;
        /* ugly ie */
        zoom:1;/*force hasLayout*/
        position:relative;/*for absolute position of child element*/

;


}

ul.dropdown a.selected-l span {

    position:absolute;
        left:-7px;top:-7px; /* strength + pixelradius */
        z-index:-1;/* force under the normal text */
        /* the magic: filters */
        filter:
            progid:DXImageTransform.Microsoft.Glow(Color=#eeeeee,Strength=2)
            progid:DXImageTransform.Microsoft.blur(pixelradius=5, enabled='true')
        ;
        zoom:1;/*force hasLayout*/

}

Answer 1

我的建议是使用CSS3 text-shadow（适用于基于Webkit的浏览器，FF3.5，Opera 9.5）。

对于IE，使用IE条件注释来实现以下之一：

sIFR
cufon
FLIR（不太确定阴影效果）
IE-DXImageTransform

一些相关文章：

Answer 2

查看我写的关于此问题的帖子：

Crossbrowser Text Shadow with Jquery

也许这更像是你的胡同？它 IS 虽然使用jQuery并不是一种真正的超高效方式..但无论如何它是一些东西。：）

跨浏览器文本阴影

2 个答案: