<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>图片放大案例</title>
<style type="text/css">
div{
overflow: hidden;
float: left;
margin: 10px;
}
div img{
width: 310px;
height: 224px;
transition: all .4s;
}
div img:hover{
transform: scale(1.2);
}
</style>
</head>
<body>
<div><a href="https://blog.csdn.net/zag666"><img src="http://www.china-train.net/content/images/temp/r_9.jpg" ></a></div>
<div><a href="https://blog.csdn.net/zag666"><img src="https://img-blog.csdnimg.cn/20190831145504204.jpg?x-oss-process=image/resize,m_fixed,h_224,w_310" ></a></div>
<div><a href="https://blog.csdn.net/zag666"><img src="https://img-blog.csdnimg.cn/20190831145504204.jpg?x-oss-process=image/resize,m_fixed,h_224,w_310" ></a></div>
</body>
</html>
原文：https://www.cnblogs.com/xiaobu-wu/p/12662670.html