Html 如何设置超链接下划线的颜色和位置？

对于设置超链接下划线的颜色和垂直位置，是否有满足所有这些条件的解决方案

在现代浏览器中工作

需要纯CSS（不添加HTML元素或JavaScript）

在链接断开成多条线的情况下也有效（这是我知道的大多数解决方案的主要缺点）

无论超链接的

显示值是多少（
inline
，
block
，
inline block
或更详细），都可以正常工作

---

我已经查看了所有的问答，但我发现的每个解决方案都不符合一个或多个标准。

要自定义下划线，可以在“A”元素中添加边框

 a{
      text-decoration: none;
      border-bottom: 1px solid #yourcolor;
  }

---

要自定义下划线，可以在“a”元素中添加边框

 a{
      text-decoration: none;
      border-bottom: 1px solid #yourcolor;
  }

---

为此，我总是使用伪类

：before

和

：after

我担心我建议的解决方案也无法满足多线路连接的要求；但你在这里有点迷路。你想在每一行的整个链接上加一次下划线还是加一次下划线？（我认为后者看起来并不甜蜜）

此技术的唯一前提是： 元素必须是静态以外的任何其他位置 元素需要

：在
之前或
：在
之后

请看这里：

为此，我总是使用伪类
：before
和
：after

我担心我建议的解决方案也无法满足多线路连接的要求；但你在这里有点迷路。你想在每一行的整个链接上加一次下划线还是加一次下划线？（我认为后者看起来并不甜蜜）

此技术的唯一前提是：
元素必须是静态以外的任何其他位置
元素需要
：在
之前或
：在
之后

请看这里：

不幸的是，下划线的垂直位置不能这样设置。（例如，将下划线移近文本或使划线穿过。）不幸的是，下划线的垂直位置不能以这种方式设置。（例如，将下划线移近文本或使划线穿过。）对我来说，多行的主要情况是。我当然希望这样的内联链接有正确的下划线。你的例子中的换行不是只有内联元素才有可能吗？当你把它变成一个内联块时，它会这样包装，对吗？所以再看看我的笔：对我来说，多行的主要情况是。我当然希望这样的内联链接有正确的下划线。你的例子中的换行不是只有内联元素才有可能吗？当你把它变成一个内联块时，它会这样包装，对吗？所以再看看我的笔：