带边框的锚文本 - ＆gt;排除图像

Question

我想将border-bottom: solid 2px应用于锚点（因为它看起来比text-decoration: underline要好得多，但我希望将该锚点中的图像排除在获得边框底部之外。

<a>I have a border</a>

<a>I have a border too <img src="img.jpg" title="I have no border" /></a>

我的猜测是

a > * {
    border-bottom: solid 2px;
}

a > img {
     border-bottom: none;
}

但是这不起作用，因为> *期望锚中的元素，它不适用于原始文本。

Answer 1

如果不使用span：

，我没有看到干净的答案

HTML

<a>No border<img alt="No border"/><span>Border</span></a>

CSS

a > span {
    border-bottom: solid 2px;
}