你能给<abbr>标签样式吗？

Question

您可以使用css来样式<abbr>标记吗？在firefox中，它在下面的图片中用圆点显示：

​

这是一个浏览器的东西吗？您可以删除点还是只使用title="title here"选项？谢谢

Answer 1

• 你能用css设计标签的样式吗？ 可以，停那儿吧。
• 在firefox中，在单词下面显示圆点。 是。Firefox默认样式为 缩写，首字母缩写{边框-底部:1 1px虚线；}
• 这是一个浏览器的东西吗？ 是的，这种行为由每个浏览器的默认样式表决定。然后，不同的浏览器在默认情况下可能会显示不同的内容。
• 你能移除这些点吗？ 是的，只需覆盖默认的syle： 缩写，首字母缩写{边框底部:无；}

Answer 2

Firefox 40有一个小变化：

Compatibility#CSS

要删除Firefox中的默认下划线，现在需要设置CSS：

text-decoration: none;

Answer 3

对于现代浏览器来说，可以使用CSS对标签进行样式化。但是，使用JavaScript的旧浏览器可能会出现退步。(但谁愿意支持IE8呢？)

abbr {
position: relative;
}

abbr:hover::after {
position: absolute;
bottom: 100%;
left: 100%;
display: block;
padding: 1em;
background: yellow;
content: attr(title);
}

这将在标签悬停时使用标题中的属性内容在标签的右上角添加一个绝对定位的伪元素。