<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
img{
position:absolute;
}
.m2{
display: none;
}
li:hover > .m2{
display: inline;
z-index: 10;
}
</style>
</head>
<body>
<ul>
<li>
<img class="m1" src="https://s3.bytecdn.cn/aweme/resource/web/static/image/index/download_476d015.png">
<img class="m2" src="https://s3a.bytecdn.cn/aweme/resource/web/static/image/index/QRcode_c129445.png">
</li>
</ul>
</body>
</html>
直接复制到html里面就可以运行,修改里面的图片就好了,上面样式中可以用id选择器。
-------------------------------------------------------------------------------------------------------------------
<!--二维码变大 -->
<style type="text/css">
#m1{
position:absolute;
}
#m2{
position:absolute;
}
.m2{
display: none;
}
#li:hover > .m2{
display: inline;
z-index: 10;
}
</style>
<li id="li">
<img id="m1" class="m1" src="图片小" style="height: 40px;width: 40px">
<img id="m2" class="m2" src="图片大" style="height: 150px;width: 150px">
</li>
-------------------------------------------------------------感觉有用谢谢支持(扫红包也行)------------------------------------------------------------------------------