ホームページを作成に関する備忘録

css3で、いろいろテキストシャドウを試してみる(IEは未対応かな)

cssコードとHtml





1.4方向で影を付けて立体的にしてみた。

テキスト shadow

 テキストの色は、#dddddd;です。また、影は色は#222222で、4つの影をかけてみました。

2.ちょっと白い影を付けてみました。

テキスト shadow

 テキストの色は、#666666;です。また、影は色は#ffffffで、背景色が#bbbbbbです。

3.黒の背景で、文字色は黒色。影が灰色だと・・。

テキスト shadow

 テキストの色は、#111111;です。また、影は色は#555555で、背景色を#111111にして、4つの影をかけてみました。

4.灰色の背景で、文字色も灰色。影を黒と白いしてみたら・・。

テキスト shadow

 テキストの色は、#666666;です。また、影は色は下側は#ffffffで上側を#111111にしました。背景色を#bbbbbbです。ちょっと凹んで見えるかも。

1.4方向で影を付けて立体的にしてみた。

テキスト shadow

 テキストの色は、#dddddd;です。また、影は色は#222222で、4つの影をかけてみました。

2.ちょっと白い影を付けてみました。

テキスト shadow

 テキストの色は、#666666;です。また、影は色は#ffffffで、背景色が#bbbbbbです。

3.黒の背景で、文字色は黒色。影が灰色だと・・。

テキスト shadow

 テキストの色は、#111111;です。また、影は色は#555555で、背景色を#111111にして、4つの影をかけてみました。

4.灰色の背景で、文字色も灰色。影を黒と白いしてみたら・・。

テキスト shadow

 テキストの色は、#666666;です。また、影は色は下側は#ffffffで上側を#111111にしました。背景色を#bbbbbbです。ちょっと凹んで見えるかも。