如何在鼠标悬停时使图像变暗?

如何在鼠标悬停时使图像变暗?,第1张

如何在鼠标悬停时使图像变暗?

或者,类似于erikkallen的想法,将A标签的背景设为黑色,并在鼠标悬停时将图像半透明。这样,您将不必创建其他div。

  • CSS only Fiddle(仅适用于现代浏览器)
  • 基于Javascript的jsfiddle((可能)在所有常见的浏览器中都可以工作)

基于CSS的解决方案的来源:

a.darken {    display: inline-block;    background: black;    padding: 0;}a.darken img {    display: block;    -webkit-transition: all 0.5s linear;       -moz-transition: all 0.5s linear;        -ms-transition: all 0.5s linear;         -o-transition: all 0.5s linear; transition: all 0.5s linear;}a.darken:hover img {    opacity: 0.7;}

和图像:

<a href="http://google.com" >    <img src="http://www.prelovac.com/vladimir/wp-content/uploads/2008/03/example.jpg" width="200"></a>


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/zaji/5009279.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-11-14
下一篇 2022-11-14

发表评论

登录后才能评论

评论列表(0条)

保存