【CSSの基本】CSSで文字に影をつけたい

CSSで文字に影をつけたい

CSSで文字に影を付けるには「text-shadow」プロパティを設定します。

text-shadow : a b c d e;

a・・・右方向にずらす量
b・・・下方向にずらす量
c・・・ぼかし量
d・・・色

/* 右方向と下方向に5pxずらしたグレーで3pxぼけた影を付ける */
#sample { text-shadow: 5px 5px 3px #CCC }

サンプルコード（CSS）

.kage {
     font-size: 72px;
     text-shadow: 5px 5px 3px #CCC;;
}

サンプルコード（HTML）

<div id="kage">影</div>

＜結果＞

右方向と下方向に5pxずらしたグレーの3pxぼけた影がつきました。

影

END