<abbr> 元素上不想要的双下划线

Question

6

Chrome的最新版本（v58）为<abbr>元素添加了一个虚线下划线：

abbr[title], acronym[title] {
  text-decoration: underline dotted;
}

Bootstrap本身会对<abbr>元素应用虚线底部边框，这会导致不必要的双重边框效果:

我该如何解决这个问题？

- James Donnelly

感谢您的发布！ - Dan

2个回答

1

要么删除text-decoration，要么删除border-bottom。

- Stuart

移除 border-bottom 将完全删除在默认情况下没有有虚线下划线的浏览器中的虚线。如果你删除了边框，你需要手动添加 text-decoration 确保其存在。 - James Donnelly

确实，詹姆斯 - 你会使用其中之一。 - Stuart

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- James Donnelly · Accepted Answer

这个问题可以通过在你的CSS中添加以下内容来解决：

abbr[title] {
  text-decoration: none;
}

我已经在Bootstrap的GitHub页面（#22562）上提交了这个问题，所以希望Bootstrap能在下一个版本中为我们解决这个问题。