* { margin:0; padding:0; box-sizing:border-box; } body { font:14px/1 Lato,sans-serif; color:#555; background:#eee; } .gallery { width:790px; margin:30px auto; padding:5px; background:#333; } .gallery > div { position:relative; float:left; padding:5px; } .gallery > div > img { width:250px; transition:.1s transform; transform:translateZ(0); } .gallery > div:hover { z-index:1; } .gallery > div:hover > img { transform:scale(1.5,1.5); transition:.3s transform;border: 1px solid rgba(236,236,236,1.00); } .cf:before,.cf:after { display:table; content:""; line-height:0; } .cf:after { clear:both; } h1 { margin:40px 0; font-size:24px; text-align:center; text-transform:uppercase; } footer { margin:80px 0; text-align:center; }
写了在html里面鼠标移动,图片会有浮动的动画