CSS text-underline-offset 属性

定义和用法

text-underline-offset 属性指定下划线文本装饰的偏移距离。

实例

设置下划线文本装饰的偏移距离：

div.a {
  text-decoration: underline;
}

div.b {
  text-decoration: underline;
  text-underline-offset: 10px;
}

div.c {
  text-decoration: underline wavy blue;
}

div.d {
  text-decoration: underline wavy blue;
  text-underline-offset: 10px;
}

亲自试一试

CSS 语法

text-underline-offset: auto|length|percentage|initial|inherit;

属性值

值 描述
auto 默认值。浏览器为下划线设置适当的偏移量。
length 指定偏移量为长度值。
percentage 指定偏移量为百分比值。
initial 将此属性设置为其默认值。参阅 initial。
inherit 从其父元素继承此属性。参阅 inherit。

技术细节

默认值： auto
继承性： yes
动画制作： 不支持。请参阅：动画相关属性。
版本： CSS4
JavaScript 语法： object.style.textUnderlineOffset="1em"

浏览器支持

表格中的数字表示首个完全支持该属性的浏览器版本。

Chrome Edge Firefox Safari Opera
87.0 87.0 70.0 12.1 73.0

相关页面

教程：CSS 文本装饰

参考：HTML DOM textDecoration 属性