如何更改标题标签背景的颜色？

Question

看到此图片......

有一个标题标记悬停在每个社交图标上。我正在尝试更改标题标签所在的气泡的背景颜色。

我试过这个......

a[title]:hover:after { background: #8b6ab2; }

但它没有用。有没有一般的方法可以做到，或者它必须是基于网站的动态？

Answer 1

尝试在CSS规则的末尾添加！important。您使用工具提示的任何CSS框架都可能会覆盖您的CSS。

Answer 2

我是这样做的。

<a href="#" title="This is the title to show">hover here</a>
<style type="text/css">
  a[title]:hover:after{
    content: attr(title);
    background: red; 
    position: absolute;
    left: 5%;
    top: 10%;}
 </style>

您可以使用类似

的数据属性隐藏默认标题

<a href="#" data-title="This is the title to show">hover here</a>
<style type="text/css">
a[data-title]:hover:after{
  content: attr(data-title);
  background: red; 
  position: absolute;
  left: 5%;
  top: 10%;
}
</style>

查看更多here