CSS text-decoration-thickness 屬性
示例
設定 <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%;
}
自己動手試一試 »
定義和用法
text-decoration-thickness 屬性指定裝飾線的粗細。
| 預設值 | auto |
|---|---|
| 繼承 | no |
| 可動畫 | 否，請參見各個屬性。 閱讀有關可動畫的內容 |
| 版本 | CSS4 |
| JavaScript 語法 | object.style.textDecorationThickness="5px" 嘗試一下 |
瀏覽器支援
表中的數字指定了完全支援該屬性的第一個瀏覽器版本。
| 屬性 | |||||
|---|---|---|---|---|---|
| text-decoration-thickness | 89.0 | 89.0 | 70.0 | 12.1 | 75.0 |
CSS 語法
text-decoration-thickness: auto|from-font|length/percentage|initial|inherit;
屬性值
| 值 | 描述 |
|---|---|
| auto | 瀏覽器選擇裝飾線的粗細 |
| from-font | 如果字型檔案包含首選粗細的資訊，則使用該值。否則，行為如同 auto |
| length/percentage | 將粗細指定為長度或百分比 |
| initial | 將此屬性設定為其預設值。閱讀關於initial |
| inherit | 從其父元素繼承此屬性。閱讀關於inherit |
相關頁面
CSS 參考：text-decoration 屬性
CSS 教程：CSS 文字裝飾
