どもです。
今回は、文字に影をつけるCSS「text-shadow」について、ちょっと考えてみます。

まずは基本から。

doshirouto
text-shadow: 0px 0px 0px #a00
全ての数値をゼロにすると、影は表示されません。
これは、影が文字の真下にあり、文字と重なっているためです。

doshirouto
text-shadow: 10px 0px 0px #a00
影が文字の右に表示されました。

doshirouto
text-shadow: 0px 10px 0px #a00
影が文字の下に表示されました。

doshirouto
text-shadow: -10px 0px 0px #a00
ひとつめを負の数にすることで、影を左に表示させることができました。

doshirouto
text-shadow: 0px -10px 0px #a00
同様に、ふたつめを負にすると影は上方向に表示されます。

doshirouto
text-shadow: 10px 10px 0px #a00
左右と上下の両方に数値を入れれば、影は好きな場所に表示させられます。

doshirouto
text-shadow: 0px 0px 4px #a00
みっつめの数値を入力することで、影にぼかしが入りました。
ぼかしがないときに比べ、随分と色が薄くなっています。

doshirouto
text-shadow: 0px 10px 4px #a00;
影の位置をずらしたところ、影の色は濃くなったように見えます。
この理由は、全てが0pxのときに影が表示されないのと同じ。
縦横0pxの状態では影の中心（最も濃い部分）が文字の下に隠れてしまっていたためです。
とはいえ、本来の色と比べるとまだかなり薄いです。

doshirouto
text-shadow: 0px 0px 6px rgba(255,0,0,0.5)
色を指定する部分は、他のCSSと同じくrbgaで指定することもできます。

ちょこっと応用編

doshirouto
text-shadow: 10px 10px 2px #a00, -10px -10px 2px #a00
影は複数個表示することができます。

doshirouto
text-shadow: 0px 10px 2px #a00, 10px -10px 2px #a00, 60px 10px 2px #a00, 70px -10px 2px #a00
沢山表示できます。
実際のサイトでこんなことをしても鬱陶しいだけですが、これは応用すると結構便利です。

doshirouto
text-shadow: 1px 0px 0px #a00, 0px 1px 0px #a00, -1px 0px 0px #a00, 0px -1px 0px #a00 (本体にcolor:#fff;)
ぼかしをなくし、上下左右にそれぞれ影を表示することで文字を縁取りすることができます。
昨今では文字の縁取りにtext-strokeを用いることもできますが、text-strokeは内側に縁を引くため、往々にしてtext-shadowのが良かったりします。

doshirouto
text-shadow: 1px 0px 4px #a00, 0px 1px 4px #a00, -1px 0px 4px #a00, 0px -1px 4px #a00
同様に上下左右にそれぞれ表示させ、ぼかすこともできます。
文字を中心に広がり、最も濃い部分が文字の外に出ており、かつ複数の影が重なっているので、0座標で影をつけるよりも濃い影をつけることができます。