CSS | text-decoration-skip-ink 属性

简介

text-decoration-skip-ink属性是CSS3新增的文本装饰属性，它能够控制文本装饰线是否跳过中日韩等语言中的假名字符（也称为“人名汉字”）、口语符号和其它字符集中的特殊字符。它只适用于通过text-decoration属性设置的文本装饰（如下划线和删线），不适用于其它类型的文本修饰（如边框，背景色等）。

语法

text-decoration-skip-ink: none | auto;

• none: 不跳过任何字符，该值为默认值。
• auto: 跳过符号和语言特定的字符，包括中日韩的假名字符，音节字符等。

样例

基本样例

以下是一个基本的text-decoration-skip-ink样例：

a {
    text-decoration: underline;
    text-decoration-skip-ink: auto;
}

该样例表示，将所有a链接的下划线设置为自动跳过特殊字符。

组合样例

可以将text-decoration-skip-ink属性与其它text-decoration属性一起使用：

a {
    text-decoration: underline dashed;
    text-decoration-color: red;
    text-decoration-skip-ink: auto;
}

该样例表示，将所有a链接的下划线设置为虚线和实线相间，颜色为红色，并在需要时跳过特殊字符。

浏览器兼容性

text-decoration-skip-ink属性目前仅有较新的Chrome（59+）和Firefox（60+）支持。在其他浏览器中，该属性会被忽略。因此，在应用该属性时，务必做好兼容性检查。

总结

text-decoration-skip-ink属性能够控制文本装饰线是否跳过符号和语言特定的字符，在使用text-decoration属性设置文本装饰时十分实用。然而，由于它仍然处于CSS3实验性阶段，并且仅在较新的Chrome和Firefox浏览器中得到支持，因此在使用时仍需注意浏览器兼容性问题。