CSS text-decoration-color 属性值说明

描述
color定义文本装饰颜色。可以使用颜色名称,十六进制颜色代码,RGB(),RGBA(),HSL(),HSLA()。
initial将属性设置为默认值。
inherit从其父元素继承属性。
CSS text-decoration-color 属性

text-decoration-color 属性用于设置文本装饰的颜色。
我们可以从这里的 HTML 颜色中选择颜色。

在此属性的值范围内,可以将颜色应用于此类装饰,如上划线、下划线和波浪线。

text-decoration-color 属性是 CSS3 属性之一。

初始值当前颜色
应用于所有元素。它还适用于伪元素::first-letter 和 ::first-line。
继承无效
可动画的是的。颜色是有动画的。
版本CSS1,CSS3
DOM 语法object.Style.TextDecorationColor =“#ccc”;

语法

text-decoration-color: color | initial | inherit;

text-decoration-color 属性示例:

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the text</title>
    <style>
      p {
        text-decoration: overline underline;
        -webkit-text-decoration-color: #8ebf42;
        text-decoration-color: #8ebf42;
      }
    </style>
  </head>
  <body>
    <h2>Text-decoration-color 属性示例</h2>
    <p>生活终归还得继续。...</p>
  </body>
</html>

结果

在给定的示例中,使用了 Safari 的 -webkit- 扩展。

带有“underline”和“line-through”值的 text-decoration-color 属性示例:

<!DOCTYPE html>
<html>
  <head>
    <title>文档的标题</title>
    <style>
      p {
        text-decoration-line: underline;
        text-decoration-color: #666666;
        text-decoration-style: wavy;
      }
      s {
        text-decoration-line: line-through;
        text-decoration-color: #c91010;
      }
    </style>
  </head>
  <body>
    <h2>Text-decoration-color 属性示例</h2>
    <p>把痛苦停在昨天 把<s>微笑</s> 留给明天。</p>
  </body>
</html>
日期:2020-06-02 22:14:47 来源:oir作者:oir