或者,类似于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>
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)