備忘録的プログラミングリファレンス

text-decoration-lineプロパティ

 text-decoration-lineプロパティは、テキストの下線、上線、取り消し線、2重線など指定するプロパティです。
 CSSでは、text-decorationプロパティはテキストへの装飾という扱いです。

 text-decoration-lineプロパティは複数の値を指定することができ、テキストの下と上に線を入れることもできます。

取り消し線(Exampleの参照
text-decoration-line: line-through;

関連プロパティ

 以下のような関連するプロパティがあります。

text-decoration-color装飾線の色
text-decoration-style装飾線の線種
text-decoration装飾線のプロパティtext-decoration-*を一括指定

マーカーのような線を加えるにはbackgroundプロパティlinear-gradient()関数を使います。

構文(Syntax)

CSS

text-decoration-line: none | underline | overline | line-through | initial | inherit;

DOM(JavaScript)

値の取得
String = object.style.textDecorationLine;
値の設定
object.style.textDecorationLine="none | underline | overline | line-through | initial | inherit";

値(Values)

Value摘要
none初期値(default値)
underline下線
overline上線
line-through中央を貫く線(取り消し線のような)
initial初期値に戻す
inherit親エレメントのプロパティを継承

備考(Remarks)

初期値(Default value)none
継承(Inherited)No
CSS AnimationNo

Example

 text-decoration-lineの例です。

 ここではline-through値で、テキストの中央に線が表示されます。