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

Question

为什么这行不通？文本颜色改变，但不透明度不变。

<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>

https://jsfiddle.net/tmgordon/veL0n4g2/2/

Answer 1

内联样式覆盖 CSS。所以摆脱那个 HTML 样式属性，否则您将不得不使用 JavaScript。使用外部 CSS 设计所有内容，因此它也被缓存到用户浏览器中。如果更改 CSS，请确保更改 src，否则客户端浏览器可能会记住旧的 CSS。