你能设计一个<abbr>标签吗？

Question

你能用<abbr>css 设计标签吗？在Firefox中,它会在下面的单词下面显示点,如下图所示:

这是浏览器的浏览器吗？你可以删除点或你只是使用title="title here"选项？谢谢

Answer 1

Firefox 40有一个很小的变化:

https://developer.mozilla.org/en-US/Firefox/Releases/40/Site_Compatibility#CSS

要删除Firefox中的默认下划线,您现在需要设置CSS:

text-decoration: none;

Answer 2

• 你能用css设计标签吗？

  是的你可以.

• 在Firefox中,它会在单词下面显示点

  是.Firefox默认样式是

  abbr[title], acronym[title] {
      border-bottom: 1px dotted;
  }
  

• 这是浏览器的浏览器吗？

  是的,此行为由每个浏览器的默认样式表决定.然后,默认情况下,不同的浏览器可能会显示不同

• 你可以删除点吗？

  是的,只需覆盖默认的syle:

  abbr[title], acronym[title] {
      border-bottom: none;
  }
  

Answer 3

可以使用适用于现代浏览器的 CSS 来设置标签的样式。但是，可以使用带有 JavaScript 的旧版浏览器的后备方案。（但是谁愿意支持 IE 8 呢？）

abbr {
position: relative;
}

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

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