محرر ويب أونلاين

​x
 
<!DOCTYPE html>
<html>
    <head>
        <style>
.container {
    perspective: 100px;
    height: 100px;
    width: 100px;
    margin: 30px auto;
    border: 1px solid darkgray;
}
​
#demo {
    display: block;
    height: 100%;
    width: 100%;
    background: dodgerblue;
    transform-origin: left top;
    transform: rotateZ(20deg);
}
        </style>
    </head>
    <body>
        <h2>CSS transform-origin</h2>
        <p>This property sets the position of the transform origin point.</p>
        <div class="container">
            <div id="demo">Transformed</div>
        </div>
    </body>
</html>