タイポグラフィ（デザイン）
text-decoration-thickness
傍線の太さを指定する
| value | description | |
|---|---|---|
auto (default) | ブラウザで決められている初期値の太さにする （Google Chrome では 1px） | Tokyo Olympic |
1px | 太さを指定する | Tokyo Olympic |
2px | 太さを指定する | Tokyo Olympic |
4px | 太さを指定する | Tokyo Olympic |
Demo
※ 太い線で破線になっているように見えるのは、"y"や"p"などのベースラインより下に突き出ているアルファベットでは、下線が途切れるようになっているためです。
The Tokyo Olympics were held in 2021.
The Tokyo Olympics were held in 2021.
<p>The <span class="line style-1">Tokyo Olympics</span> were held in 2021.</p>
<p>The <span class="line style-2">Tokyo Olympics</span> were held in 2021.</p>
.style-1 {
text-decoration-thickness: 1px;
}
.style-2 {
text-decoration-thickness: 4px;
}
.line {
text-decoration-line: underline;
text-decoration-color: rgb(56, 189, 248);
}
概要
傍線の太さを設定することができます。
通常はtext-decorationプロパティで、傍線に関する値をまとめて設定することが多いです。
関連
参照
- 参照