旋轉圖片CSS代碼

jopen 9年前發布 | 6K 次閱讀 HTML CSS 

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;

    <html xmlns="http://www.w3.org/1999/xhtml"&gt;

    <head>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <title>CSS旋轉圖片</title>

    <style type="text/css">



    #div_img{  
        margin: 100px auto 0;  
        transform:rotate(30deg);  
        -moz-transform:rotate(30deg);  
        -webkit-transform:rotate(30deg);  
        -o-transform:rotate(30deg);  
        filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=3);  
    }  
</style>  
</head>  

<body style="width:99%; height:100%;">  
   <div id="body_div" style="text-align:center; vertical-align:middle;">  
        <img src="cat.jpg" id="div_img" width="500" height="400"/>  
   </div>  
</body>  
</html>  </pre>
 本文由用戶 jopen 自行上傳分享，僅供網友學習交流。所有權歸原作者，若您的權利被侵害，請聯系管理員。
 轉載本站原創文章，請注明出處，并保留原始鏈接、圖片水印。
 本站是一個以用戶分享為主的開源技術平臺，歡迎各類分享！