鼠标经过图片放大
源代码
(
显示异常
)
：
点击运行
<!DOCTYPE html> <html> <head> <style> div { width:100px; /*宽度*/ height:200px;/*高度*/ background:red;/*背景为红色*/ transition: 0.3s;/*图片放大所用时间*/ margin: 100px;/*边框宽度*/ } div:hover { transform: scale(1.1); /*大于1是放大，小于1是缩小，1是不变*/ } </style> </head> <body> <div><img src="https://www.meishuzi.com/logo/zb_users/upload/2023/03/20230323103719167953903946096.jpg" /></div> <div>图片地址</div> <p>把鼠标指针移动到红色的图片上就可以看到过渡效果。</p> </body> </html>
运行结果
全站首页
编辑器
CSS学习
空编辑器
留言本