不同颜色的下划线和字体

Question

有没有办法为文本的下划线和文本本身制作不同的颜色？

似乎 text-decoration-color 在大多数浏览器上是 not available。那么还有其他方法吗？

Answer 1

使用 border-bottom 和 text-decoration: none。好像和带下划线的 link.

一样

看看下面的代码片段：

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

a:hover {
  color: blue;
  border-color: red;
}

<a href="#">This is a underlined link</a>

希望对您有所帮助！

Different color for underline then font