2D变形transform的translate和rotate 

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>transform的 translate和rotate</title>
        <style type="text/css">
            #div1{
                height:200px;
                width: 200px;
                border:1px solid;
                transform: translate(100px,100px);
            }
            #div2{
                height: 100px;
                width: 100px;
                background: yellow;
                border:1px solid;
                transform: rotate(35deg);
                padding: 10px;
                transform-origin: 10% 60%;
                            }

        </style>
    </head>
    <body>
        <div id="div1">
            <div id="div2">Hello</div>
        </div>
    </body>
</html>

 

posted @ 2017-05-05 15:35  阿伦am  阅读(263)  评论(0)  编辑  收藏  举报