Computer >> Máy Tính >  >> Lập trình >> CSS

Thay đổi vị trí trên các phần tử đã chuyển đổi bằng CSS

Để thay đổi vị trí trên các phần tử được chuyển đổi bằng CSS, hãy sử dụng biến đổi-nguồn gốc tài sản.

Bạn có thể thử chạy mã sau để thay đổi vị trí:

Ví dụ

<!DOCTYPE html>
<html>
   <head>
      <style>
         .demo1 {
            width: 300px;
            height: 300px;
            background-color: yellow;
         }
         .demo2 {
            width: 200px;
            height: 200px;
            background-color: orange;
         }
         .demo3 {
            width: 100px;
            height: 100px;
            background-color: blue;
            transform: rotate(10deg);
            transform-origin: 30% 40%;
         }
      </style>
   </head>
   <body>
      <h1>Rotation</h1>
      <div class = "demo1">Demo
         <div class = "demo2">Demo
            <div class = "demo3">
               Demo
            </div>
         </div>
      </div>
   </body>
</html>