Question

HTML如何鼠标悬浮图片同比缩小

如题所示，用什么方法都可以，当然，两张图片的回答还是算了！只想鼠标悬浮以那张图片中心为中心，同比缩小。

Answer 1

<img src="imgpath" class="img">

.img{height:200px}
.img:hover{height:100px}
先定义一个图片的高度或者宽度 定义其中一个属性 图片会等比例缩放前提是你的图片要够大
鼠标放上的时候在把图片的属性缩小 当然你也可以用js或者jquery 来实现方法有很多 看你习惯了

Answer 2

用hover改变图片宽度，如果你本身图片没有设置高度的话是可以同比缩小的，但是要在中心点的话，那你就同时改变它的位置，如果用绝对定位的话就把它top位置加上原来的高度减去现在高度除以二这样，left也是这样

Answer 3

用CSS3的transform: scale（缩放的比率，如0.5）
a:hover{
transform: scale(0.5);
}

Answer 4

这个要兼容性强的话 ，最好用js。onmousemove鼠标事件。改变img标签的top和left，height和width的值，前提是这个img不是固定定位。

Answer 5

<img onMouseOver="this.width=50" onMouseout="this.width=100" src="" width="100" > 图片同比缩小是可以的只要控制宽或只是高都会同比缩小的但是要在中心点我就做不了你看看是否可以