Go to information

text-shadow

text-shadowプロパティは要素内のテキストに対して影の効果を付けることができます。コンマ(,)で区切って複数の影を付けることもできます。現状で text-shadowプロパティのレンダリングに対応している UA は safari のみです。このプロパティは影の大きさがボックスの大きさ自体に影響を与えることはありませんが、ボックスの範囲を超えて表示されることがあるので注意が必要です。影の位置の指定(1番目と2番目の長さ)は必須で、影のぼかし範囲(3番目の長さ)と影の色は任意指定です。

初期値
none
適用対象
すべての要素
継承
しない
メディア
visual

text-shadowプロパティの値には影効果を付けない "none"(初期値)、または "<長さ> <長さ> <長さ>? <色>?" の形式で影効果を指定できます。<長さ> は "em", "px" などの単位識別子を伴う数値で指定し、<色> は16進数RGB値カラーネームなどで指定します。また、コンマ(,)で区切ることで複数の影効果を付けることもできます。

text-shadowプロパティの実装状況

Windows版Internet Explorer
×
Firefox
×
Opera
×
Safari
○(複数指定には対応していない)
Macintosh版Internet Explorer 5
×

サンプル

記述例
h2 {
color : black ;
text-shadow : 4px 4px 3px red ;
}
表示例

現在、text-shadowプロパティに対応しているのは Safari のみですが、コンマ(,)区切りの複数指定には対応していないようです(複数指定の例:text-shadow : 4px 4px 3px red, 8px 8px fuchsia, 12px 12px maroon ;)。

現在位置
  1. W3G
  2. CSS
  3. テキスト
  4. text-shadow
ナビゲーション
ステータス情報
作者
上田 遼
公開
2007-02-02T17:42:03+09:00
更新
2008-12-29T04:30:40+09:00
URI
http://w3g.jp/css/text/text-shadow
検索