样式:
<style>
div#resize a:hover { position: absolute;}
div#resize a:hover img { width: 200px; height: 200px}
</style>
代码:
<div id="resize">
<a href="#">
<img src="<s:propertyvalue="pic" />" border=0 height="50"width="50">
</a>
</div>
本文介绍了一个使用CSS实现的鼠标悬停效果案例。当鼠标悬停在一个特定的div元素上时,该元素的位置会变为绝对定位,并且其中的图片尺寸会放大至200x200像素。代码通过简单的HTML结构结合CSS选择器来实现这一效果。
样式:
<style>
div#resize a:hover { position: absolute;}
div#resize a:hover img { width: 200px; height: 200px}
</style>
代码:
<div id="resize">
<a href="#">
<img src="<s:propertyvalue="pic" />" border=0 height="50"width="50">
</a>
</div>