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

为什么不能正常工作？文字颜色会改变，但不透明度不会。使用CSS悬停更改链接不透明度

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

来源

2016-12-28 Tom Gordon

正如@PHPglue所述，请看CSS特殊性：https：//developer.mozilla.org/en-US/docs/Web/CSS/Specificity – johnniebenson

内联样式覆盖CSS。所以摆脱这种HTML风格的属性，否则你将不得不使用JavaScript。使用外部CSS对所有内容进行样式设置，以便将其缓存到用户浏览器中。确保在更改CSS时更改src，否则客户端浏览器可能会记住旧的CSS。

来源

2016-12-28 03:15:44 PHPglue

你可以试试这个。

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

来源

2016-12-28 03:18:27

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

回答

相关问题