2013-06-06 34 views
1

是否有更好的方法可以为文字阴影提供更大的密度?我发现的唯一解决方案是多次重复文本上的文字阴影,但这有点草率。我认为IE10支持传播半径,但它是唯一的。在CSS中的文字阴影密度以获得模糊效果

body{ 
    background:#000 
} 
h1 { 
    font-size: 25px; 
    font-family:Arial; 
    color: #F90; 
    text-shadow: 
     0 0 20px #FFF, 
     0 0 20px #FFF, 
     0 0 20px #FFF, 
     0 0 20px #FFF, 
     0 0 20px #FFF, 
     0 0 20px #FFF, 
     0 0 20px #FFF, 
     0 0 20px #FFF, 
     0 0 20px #FFF, 
     0 0 20px #FFF, 
     0 0 20px #FFF, 
     0 0 20px #FFF, 
     0 0 20px #FFF, 
     0 0 20px #FFF; 
} 

比较工作实例中的jsfiddle:

http://jsfiddle.net/poselab/jAgF3/3/

http://jsfiddle.net/poselab/pHnTm/

+0

据我所知,在这个时候没有其他的方式。你可以混合使用1px 1px的白色,-1px 1px的白色等等,使亮度更高,但是,太多会做一些pixelArt :) –

回答

0

我不知道你想要什么来实现@PoseLab但 “模糊” 的文字属性如果您检查了对此的支持,大多数浏览器都支持阴影。 caniuse.com

通过将模糊从0上下改变,肯定会将密度从纯色改变为更褪色的效果。

可能做这样的事情

text-shadow:2px 2px 0 #fff; 

JS Fiddle

希望这会有所帮助,你可以随时玩弄文本阴影生成了。

CSS3 text shadow generator

P.S(我也道歉,文字阴影在IE9支持以及)