<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> *{ margin: auto; padding: 0; } #a1{ width: 200px; height: 200px; border: 1px solid red; background-image: url(../3.28/1.jpg); background-size: 100% 100%; transition: 2s; } #a1:hover{ transform: rotate(120deg); } #a2{ width: 200px; height: 200px; border: 1px solid red; background-image: url(../img/3601.png); background-size: 100% 100%; transition: 2s; } #a2:hover{ transform: translate(30px,30px) } #a3{ width: 200px; height: 200px; border: 1px solid red; background-image: url(../img/3603.png); background-size: 100% 100%; } #a3:hover{ transform: scale(1.5,1.5); transition: 2s; } </style> </head> <body> <div id="a1"> </div> <div id="a2"> </div> <div id="a3"> </div> </body> </html>
