Firefox 3.5でようやくtext-shadowプロパティをサポート、ならばつかわねば
7月1日にリリースされたFirefox 3.5において個人的に嬉しいのがCSS (Cascading Style Sheets: スタイルシート) で「text-shadow」プロパティをサポートしてくれるようになったこと。文字通り、Webページ上のテキストに影を付けるために使用するプロパティで、実はSafariではとっくの昔に対応済みだし、Operaでも最新版でサポート、GoogleのChromeもSafariと同じWebkitを採用してるので当然対応済みでした。つまり、メジャー系WebブラウザではFirefoxとInternet Explorerだけが対応していなかったわけですが、今回Firefoxが対応した事によってInternet Explorerだけが（わっはっは）未対応という事になりました。
では、text-shadowの使い方。
"color"は影に使用する色の指定。値の記述は文字色の指定と全く同じで、6桁または3桁での十六進数やRGB指定値を記述します。
"値"は左から順に、左右方向の位置、上下方向の位置、影のぼかし値となっています。例えば「1px -2px 3px」という風に書いたとすると『影は対象となる文字に対して右に1px、下に-2px (= 上に2px) ずれて表示され、3pxのぼかしが施される』ということになります。
記述方法が分かれば、あとは任意の箇所にスタイルを適用すれば良いだけ。
例えばこんな風に使います。
これを実際に表示させると…（未対応ブラウザでは影は描画されません）
実際に使ってみるまではあまり利用価値を感じないプロパティかもしれませんが、例えば背景色とテキストカラーの分離がやりやすくなるなどページデザインの自由度が多少増すとともに、視認性を少し上げる効果が生まれます。また、指定値を変えれば影ではなく『明かり (バックライト的な効果) 』としても利用できるので色々と試してみて下さい。
