本文主要介绍CSS中的下划线文本修饰属性。在文章的前面，我们使用w3cschool的基本知识做一个小的回顾。





定义和用法
文本装饰属性指定添加到文本中的修改。
注意：修改后的颜色是由颜色属性设置的。
解释
此属性允许您在文本上设置一些效果，如下划线。如果子元素没有自己的装饰，则对祖先元素设置的装饰将扩展到后代元素。
默认值：无
继承：没有

可能的值

无默认值。定义标准文本。
下划线定义文本下的一行。
强调对文本的定义线。
通过行定义了一条通过文本的行。
闪烁定义闪烁文本。
继承指定文本装饰属性的值应继承自父元素。

例子
设置H1、H2、H3和H4元素的文本修改：
h1 {文字装饰：线}
H2文本装饰：行通过}
H3文字装饰：下划线}
H4文字装饰：眨眼}

先进的
文字更能装饰

例如:

CSS代码将内容复制到剪贴板。


{
文字装饰：强调划线；
}






你可以看到在年鉴，文字修饰改性的内容更具体，添加多个属性值的亚属性文字装饰线。
改变装饰的颜色

下划线颜色默认为文本集颜色的属性值，但您可以更改：

CSS代码将内容复制到剪贴板。


{
文字装饰颜色：# f06d06；
}






Almanac文本装饰色彩修改内容的观察。

注意在壁虎下划线是下面的字体，但在WebKit /闪烁下划线在字体上：


现在，用边框代替文字装饰处理色彩突出，边框能更好地控制线条的颜色、宽度和位置，而不是文字装饰。

但是有些事情是边界所不能做到的，比如…
改变装饰风格

边框无法实现以下样式！

CSS代码将内容复制到剪贴板。


{
文字装饰风格：波浪形；
}






Almanac文本装饰风格修改内容的观察。
情况会好转的。

现在有很多方法可以更好地实现带下划线的文本：


上面的例子是在文字装饰跳过执行，但并不是所有的浏览器都支持它。同时，可以更好地使用一个更轻松的下划线和减少contrast-y的价值，在RGBA（）使用：


隐藏下划线只是它的一个函数（文本装饰）。此外，还可以使用跳转来修改某些行元素、空格，甚至控制边。

需要注意的是，Safari浏览器似乎使用默认的跳过值。