CSS文本装饰下划线颜色

可以仅更改文本下面的线条颜色？我想看到类似红色字母的下面有一条蓝线的东西，但是我找不到如何完成它的方法。

您可以通过以下CSS规则作为示例：

text-decoration-color:green

如果较旧的浏览器不支持此规则，则可以使用以下解决方案：

用底线设置单词：

a:link {
  color: red;
  text-decoration: none;
  border-bottom: 1px solid blue;
}
a:hover {
 border-bottom-color: green;
}