[ HTML ] CSS – 文字に上線 下線 取り消し線をつける ( text-decoration )

Tweet

Pocket

ここでは、HTML の文字に対して上線、下線、および取り消し線をつけるサンプルを掲載しています。レッツデコレーション！

文字に上線, 下線または取り消し線をつけるにはスタイルに text-decoration を指定します。以前は blink キーワードによって文字列を点滅させることも一部のブラウザではできましたが、今ではできなくなっています。完全に廃止されています。

text-decoration のサンプル

<p style="text-decoration: none;">通常表示</p>
<p style="text-decoration: underline;">下線をつける</p>
<p style="text-decoration: overline;">上線をつける</p>
<p style="text-decoration: line-through;">取り消し線をつける</p>
<p style="text-decoration: underline overline line-through;">全部まとめてつける</p>

実際の出力結果

通常表示

下線をつける

上線をつける

取り消し線をつける

全部まとめてつける

Tweet

Pocket