text-decoration - 文字を装飾する

投稿日:2016/02/22 / 更新日:2016/02/22

スタイルシートのtext-decorationは、文字を訂正線や下線などで装飾するためのプロパティです。

サンプルコード

text-decorationを指定したサンプルコードです。

div {
	text-decoration: underline ;
}

text-decorationにunderlineを指定して、文字に下線を付けたデモです。CSSを編集して、どのように変化するのかをお試し下さい。

<div id="element"> <p>文字の装飾はこまめに。</p> </div>

#element { text-decoration: underline ; }

値の指定方法は主に下記の通りです。リンクをクリックするとデモを確認できます。

項目	説明
inherit	親要素の値を引き継ぐ。例の場合、`div`要素の`text-decoration`には、`body`に指定された値(`underline`)が引き継がれる。
initial	プロパティの初期値が適用される。この場合、`none`(装飾なし)が適用される。
none	初期値。文字装飾されない。
underline	下線が付く。
overline	上線が付く。
line-through	訂正線が付く。

2016年7月現在の、ブラウザのサポート状況は次の通りです。全ての主要ブラウザで、ベンダープレフィクスなど気にすることなく利用できます。