当鼠标悬停时，如何让一条线只出现在链接图像的底部？
我可以在悬停时显示内边框，但我只想显示 border-bottom。
这是我到目前为止所拥有的，即使它是使用 outline 属性而不是 border:
#links a img, #links a{ border: none; float: left; }
#links a{ margin: 3px; }
#links a:hover{ outline: 3px solid black; }
不悬停:
悬停:
最佳答案
在不影响链接大小(边框附加到元素外部)的情况下获得相同结果的一个选项是使用内嵌框阴影。
在您的示例中，将您的 a:hover 更改为以下内容:
#links a:hover {
box-shadow: inset 0 -10px 0 0 cyan;
}
你可以在这里看到 fiddle :https://jsfiddle.net/kLLxkdw4/
关于html - 在悬停时添加底部边框，仅限 CSS，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/15208708/