タイポグラフィ（デザイン）

text-decoration-line

傍線を設定する

value	description
`none`	傍線なし	Tokyo Olympics
`underline`	下線	Tokyo Olympics
`overline`	上線	Tokyo Olympics
`line-through`	打ち消し線	Tokyo Olympics
`underline line-through`	下線 + 打ち消し線	Tokyo Olympics

Demo

The Tokyo Olympics were held in 2021.

<p>The <span>Tokyo Olympics</span> were held in 2021.</p>
<p>The <span class="style-1">Tokyo Olympics</span> were held in 2021.</p>
<p>The <span class="style-2">Tokyo Olympics</span> were held in 2021.</p>
<p>The <span class="style-3">Tokyo Olympics</span> were held in 2021.</p>
<p>The <span class="style-4">Tokyo Olympics</span> were held in 2021.</p>

.style-1 {
  text-decoration-line: underline;
}
.style-2 {
  text-decoration-line: overline;
}
.style-3 {
  text-decoration-line: line-through;
}
.style-4 {
  text-decoration-line: underline line-through;
}

概要

下線や~~打ち消し線~~などを設定することができます。複数の値をスペース区切りで設定することもできます。

通常はtext-decorationプロパティで、傍線に関する値をまとめて設定することが多いです。

参照

参照

text-decoration-line

Demo

概要

関連

参照