【CSS】text-decoration-line - テキストの装飾（種類）
CSSのtext-decoration-lineプロパティについてご紹介します。
text-decoration-line
text-decoration-lineはテキスト装飾の種類を表わすプロパティです。
基本構文
text-decoration-line: 値;値はスペースで区切って複数指定できます。
text-decoration-line: 値 値 値;値
一般的な値は次の通りです。
| 値 | 意味 |
|---|---|
| none | 装飾なし |
| underline | 下線 |
| overline | 上線 |
| line-through | 中央線 |
サンプル
下線
次のサンプルはテキストに下線を付けます。
<style>
p {
text-decoration-line: underline;
}
</style>
<p>text text text text text</p>上線
次のサンプルはテキストに上線を付けます。
<style>
p {
text-decoration-line: overline;
}
</style>
<p>text text text text text</p>中央線
次のサンプルはテキストに中央線を付けます。
<style>
p {
text-decoration-line: line-through;
}
</style>
<p>text text text text text</p>複数装飾
次のサンプルはテキストに上線と下線を付けます。
<style>
p {
text-decoration-line: underline overline;
}
</style>
<p>text text text text text</p>
