演示代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<link rel="stylesheet" type="text/css" href="reset.css"/>
<style type="text/css">
#wyzx{
width: 300px;height: 200px;position: relative;
}
.one{
width: 100%;height: 100%;
}
.two{
width: 200%;height: 200%;
position: absolute;top: 0;left: 300px;
display: none;
}
#wyzx:hover .two{
display: block;
}
</style>
</head>
<body>
<div id="wyzx">
<img class="one" src="small.png" >
<img class="two" src="big.png" >
</div>
</body>
</html>