text-shadow …… テキストに影をつける

text-shadowプロパティは、テキストに影をつける際に使用します。

text-shadowプロパティでは、スペース区切りで<水平方向の距離> <垂直方向の距離> <影のぼかし半径> <影の色>を指定することができます。
長さの値には、pxやemやexなどの単位が利用できます。

１番目の長さの値は、水平方向の影のオフセット距離を表します。
正の値を指定すると右へ、負の値を指定すると左へ影が移動します。

２番目の長さの値は、垂直方向の影のオフセット距離を表します。
正の値を指定すると下へ、負の値を指定すると上へ影が移動します。

３番目の長さの値は省略可能ですが、指定した場合には影のぼかし半径を表します。
ぼかし半径が指定されない場合はゼロとなります。
尚、ぼかし半径とは、ぼかし効果の境界までの距離のことですが、ぼかし効果を計算する厳密なアルゴリズムは定義されていません。

色の値は省略可能ですが、指定した場合には影の色を表します。長さの値の前か後に任意で指定します。
色の値が指定されない場合には、ブラウザが選択した色が使用されます。

上記の値のセットをカンマ（ , ）で区切って、複数の影を指定することもできます。

影は、他のテキスト装飾が適用されるのと同じように、要素のすべてのテキストに適用されます。
指定の仕方によっては影同士が重なり合うかもしれませんが、テキスト自身の上に覆われることはありません。
また、ボックスからはみだして影が表示されることがありますが、ボックスのサイズ自体が変わることはありません。

ボックスに影をつける場合には、box-shadowプロパティを使用します。

■値

■初期値・適用対象・値の継承

■使用例