1. 程式人生 > >圖片的旋轉

圖片的旋轉

class add rotate image orm ack AD -c 100%

<!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>
技術分享圖片

圖片的旋轉