Thuộc tính clip trong CSS



Thuộc tính clip trong CSS xác định một khu vực bên ngoài phần nội dung của phần tử (đã được xác định vị trí) là không nhìn thấy.

Thuộc tính clip có thể nhận giá trị:

  • auto: phần khu vực bên ngoài này là tương đương với phần nội dung của phần tử.

  • shape: miêu tả khu vực dạng shape. Như trong CSS2, cú pháp là rect(top right bottom left).

Thuộc tính clip có thể áp dụng cho:

Các phần tử Block Level trong tài liệu.

Cú pháp thuộc tính clip trong DOM

object.style.clip = rect(top right bottom left);

Ví dụ thuộc tính clip trong CSS

Dưới đây là ví dụ minh họa cách sử dụng của thuộc tính clip trong CSS.

<html>
   <head>
   
      <style type="text/css">
         div {
            background: url(../images/logo.png);
            clip:rect(10px, 155px, 145px, 10px);
            border:2px solid black;
            height:100px;
            width:150px;
            position:absolute;
            top:inherit;
            left:0px;
         }
      </style>
      
   </head>
   <body>
      <div>Vi du minh hoa thuoc tinh clip trong CSS</div>
   </body>
</html> 

Kết quả là:

Loạt bài hướng dẫn Học CSS cơ bản và nâng cao của chúng tôi dựa trên nguồn tài liệu của: TutorialspointW3Schools

Follow fanpage của team https://www.facebook.com/vietjackteam/ hoặc facebook cá nhân Nguyễn Thanh Tuyền https://www.facebook.com/tuyen.vietjack để tiếp tục theo dõi các loạt bài mới nhất về Java,C,C++,Javascript,HTML,Python,Database,Mobile.... mới nhất của chúng tôi.