CSS text-decoration-thickness 属性

定義和用法

text-decoration-thickness 屬性規定裝飾線的粗細。

另請參閱：

CSS 參考手冊：text-decoration 屬性

CSS 教程：CSS 文字

實例

為 <h1>、<h2>、<h3>、<h4> 元素設定不同粗細的裝飾線：

h1 {
  text-decoration: underline;
  text-decoration-thickness: auto;
}
h2 {
  text-decoration: underline;
  text-decoration-thickness: 5px;
}
h3 {
  text-decoration: underline;
  text-decoration-thickness: 50%;
}
/* 使用簡寫屬性 */
h4 {
  text-decoration: underline solid red 50%;
}

親自試試

CSS 語法

text-decoration-thickness: auto|from-font|length/percentage|initial|inherit;

屬性值

值 描述
auto 瀏覽器選擇裝飾線的粗細。
from-font 如果字體文件包含有關首選粗細的信息，請使用該值。如果沒有，則表現為 auto。
length/percentage 規定粗細為長度值或百分比值。
initial 將此屬性設定為其默認值。參閱 initial。
inherit 從其父元素繼承此屬性。參閱 inherit。

技術細節

默認值： auto
繼承： 否
動畫製作： 不支持。請參閱：動畫相關屬性。
版本： CSS4
JavaScript 語法： object.style.textDecorationThickness="5px"

瀏覽器支持

表中的數字注明了首個完全支持該屬性的瀏覽器版本。

Chrome IE / Edge Firefox Safari Opera
89.0 89.0 70.0 12.1 75.0