text-shadowプロパティ

text-shadowプロパティは、テキストに影を付けます。値として、スペースで区切った4つのパラメータ、または、影を完全に取り消す（これがデフォルト値）キーワード noneを指定します。

構文

セレクタ {
	text-shadow: X軸方向の移動量 Y軸方向の移動量 ぼかし半径 色;
}

セレクタ {
	text-shadow: none;
}

パラメータ	説明
X軸方向の移動量	X軸方向への影の移動量を指定します。正の値は右方向、負の値は左方向に移動します。
Y軸方向の移動量	Y軸方向への影の移動量を指定します。正の値は下方向、負の値は上方向に移動します。
ぼかし半径	影のぼかしの度合いを指定します。値が大きいほど、影はよりぼやけます。オプションパラメータ。指定しない場合、影はくっきりとした輪郭になります。
色	色の単位で影の色を指定します。オプションパラメータ。指定しない場合、影の色はテキストの色と同じになります。

X軸・Y軸方向の移動量およびぼかし半径は、パーセントを除くサイズの単位で指定します。

影を下方向・右方向に移動させ、少しぼかしてみましょう：

<div id="elem">
	Lorem ipsum dolor sit amet.
</div>

#elem {
	text-shadow: 5px 5px 3px black;
}

今度は、影の色を赤にして、下方向・右方向に移動させますが、ぼかしは取り除いてみます。影はくっきりとしたものになります：

<div id="elem">
	Lorem ipsum dolor sit amet.
</div>

#elem {
	text-shadow: 10px 10px red;
}

今回は、影の位置は移動させずに、ぼかしだけを加えてみます：

<div id="elem">
	Lorem ipsum dolor sit amet.
</div>

#elem {
	text-shadow: 0px 0px 3px black;
}