傍線をまとめて指定する

text-decoration

{ text-decoration 【 テキスト・デコレーション 】 : -line -style -color; }

text-decorationプロパティは、文字の傍線をまとめて指定するショートハンドです。

初期値 none
継承 なし
適用される要素 すべての要素
モジュール CSS Text Decoration Module Level 3

値の指定方法

指定できる値は各プロパティと同様です。値は半角スペースで区切って指定します。省略した場合は、各プロパティの初期値が適用されます。

2015年1月現在では、Firefoxがこのプロパティに対応していますが、適用するには接頭辞に-moz-を記述します。

サンプルコード

a:link {
  -moz-text-decoration: underline red;
}

上の例で指定したtext-decorationプロパティは、各プロパティを以下のように指定した場合と同様の表示になります。

a:link {
  -moz-text-decoration-line: underline;
  -moz-text-decoration-style: solid;
  -moz-text-decoration-color: red;
}

ポイント

  • text-decorationプロパティは、CSS2.1の仕様では文字に傍線を引くためのプロパティとして定義されていましたが、CSS3の仕様では、傍線のスタイルや色も指定できるショートハンドとして定義されています。

関連記事