css - ぼかし効果を得るためのCSSのテキストシャドウ密度

Question

text-shadow の密度を高くするより良い方法はありますか? 私が思いついた唯一の解決策は、テキストにテキストシャドウを複数回繰り返すことですが、これはやや雑です。IE10はスプレッド半径をサポートしていると思いますが、それは唯一のものです。

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/

Answer 1

@PoseLab を達成しようとしていることは正確にはわかりませんが、テキストシャドウの「ぼかし」属性は、これのサポートを確認すると、ほとんどのブラウザーでサポートされています。 caniuse.com

ぼかしを 0 から上下に変更すると、確実に濃度が単色からより色あせた効果に変わります。

多分何かのようなことをしている

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

JSフィドル

これが役に立てば幸いです。いつでもテキストシャドウジェネレーターをいじることができます。

CSS3 テキスト シャドウ ジェネレーター

PS (申し訳ありませんが、Text-shadow は IE9 でもサポートされています)