2011/08/10CSS3のプロパティ「text-shadow」を使ってフォントを装飾する方法です。フォントにシャドウを付ける以下のように設定することで、フォントに影を付けることができます。影の色は「#ff0000」にというように指定してあります。text-shadowのサンプルです。12で表示できていることを確認できています。残念ながらIEは対応していません。要素をカンマ区切りにすることで、複数の影を表示することができます。blue;text-shadowのサンプルです。フォントを立体的に見せる以下のように同色で厚みを持たして、最後に別の色を敷くことで、フォントを立体的に浮き上がらすことができます。#999999;text-shadowのサンプルです。フォントを浮き上がらせるフォントカラーと背景色が同じ色ですが、左上と右下に1ピクセルずらした影を置くことで、文字を浮き上がらしています。#333333;text-shadowのサンプルです。フォントカラーと背景色を同一色にするのは、SEO的にペナルティだったはずですが、この場合はどうなるのでしょうか。他にも、フォントを燃え上がらせる、フォントに光沢をもたせるなどのサンプルが、さまざまなサイトで紹介されていますが、デザイン的にも日本語フォントには適していないような気がします。fontsなどと組み合わせて、ロゴやボタンなどにうまく利用したいですね。コメントをキャンセルメールアドレスが公開されることはありません。コメントデータの処理方法の詳細はこちらをご覧ください。inc.Profileサイト「helog」は私がWeb制作に携わるなかでの経験を中心に記しています。前にも発生したんだよなぁ。」といった無駄な時間を省くことを目的に書き始めました。「へ」の「ログ」です。個人的な技術メモのようなものですが、みなさんの何か役に立つことがあればこの上ないです。