text-shadowで文字を立体的に、または陥没させる

textshadownorei.webp

(text-shadowを使用した例

フォントの上下左右にを作って、立体感や陥没を作り出すCSSプロパティ「text-shadow」。

昔はダサめのサイトでしか使われていなかったのに、ここ最近は、デザインに凝ったセンスの良いサイトでは必ずといって良いほど使われるようになりました。

いきなりtext-shadowを見掛けるようになった理由としては、ぼかしが値が指定できるようになった事、IE以外のブラウザ(Firefox, Google Chrome, Safari, Opera)でサポートされた事、マシンパワーの飛躍的な向上とブログの普及に伴って、重いサイトへの耐性が出来た事などが考えられますが、ただ単に「流行」というのもあるでしょう。

どちらにしても、今が使い時なのは確かです。

続きを読む →