使用CSS更改悬停时的链接不透明度

使用CSS更改悬停时的链接不透明度,css,hyperlink,hover,opacity,Css,Hyperlink,Hover,Opacity,为什么这样不行?文字颜色会更改,但不透明度不会更改 <style> .button:hover{ color: #FFFF00; opacity: 0; } </style> <a href="#" style="position:absolute; opacity: 0.3;background: #000;width:139px;height:150px;top:0;left:0;" class="button"></a> .按

为什么这样不行?文字颜色会更改,但不透明度不会更改

<style>
.button:hover{
  color: #FFFF00;
  opacity: 0;
}
</style>

<a href="#" style="position:absolute; opacity: 0.3;background:  #000;width:139px;height:150px;top:0;left:0;" class="button"></a>

.按钮:悬停{
颜色:#FFFF00;
不透明度:0;
}

内联样式覆盖CSS。所以,去掉那个HTML风格的属性,否则就必须使用JavaScript。使用外部CSS为所有内容设置样式,以便将其缓存到用户浏览器中。如果您更改了CSS,请确保您更改了src,否则客户端浏览器可能会记住旧的CSS。

您可以试试这个

<style>       
 .button {
    opacity: 0.3;
 }

 .button:hover{
      color: #FFFF00;
       opacity: 0;
    }
</style>
<a href="#" style="position:absolute;background: #000;width:139px;height:150px;top:0;left:0;" class="button"></a>

.按钮{
不透明度:0.3;
}
.按钮:悬停{
颜色:#FFFF00;
不透明度:0;
}

正如下面提到的@PHPglue一样,看看CSS的特殊性: