jpg pro pre odi CSS code lin log
在鼠标经过图片时,图片被放大,而且还有个过渡的效果....
- 1 <!DOCTYPE html>
- 2 <html>
- 3 <head>
- 4 <link href="css/prodInfo.css" rel="stylesheet" type="text/css">
- 5 </head>
- 6 <style>
- 7 div img{
- 8 border:1px soild red;
- 9 height: 218px;
- 10 width: 222px;
- 11 width:100%;
- 12 transition: all 0.6s;
- 13 }
- 14 img :hover{
- 15 transform: scale(1.2); /* 放大1.2倍 */
- 16 }
- 17 </style>
- 18 <body>
- 19 <div>
- 20 <img src="img/prodInfo/lf.jpg"/>
- 21 </div>
- 22 </body>
- 23 </html>
CSS3 实现鼠标经过图片时图片放大
来源: http://www.bubuko.com/infodetail-2111959.html