101 of 313 menu

Thuộc tính clip

Thuộc tính clip cho phép cắt xén một phần tử được định vị tuyệt đối, chỉ để lại một vùng hình chữ nhật được chỉ định là có thể nhìn thấy. Giá trị được xác định bằng cách sử dụng hàm rect.

Cú pháp

bộ chọn { clip: rect(trên, phải, dưới, trái) | auto; }

Chuẩn bị hình ảnh

Giả sử chúng ta có một bức ảnh thiên nhiên mà chúng ta sẽ cắt xén:

<img src="image.jpg" width="500">

:

Ví dụ

Hãy cắt xén hình ảnh, chỉ để lại phần trung tâm có thể nhìn thấy:

<div class="container"> <img class="image" src="image.jpg"> </div> .container { position: relative; width: 400px; height: 300px; } .image { position: absolute; clip: rect(50px, 350px, 250px, 50px); width: 400px; height: 300px; }

:

Xem thêm

  • thuộc tính clip-path,
    phương án thay thế hiện đại để cắt xén phần tử
  • thuộc tính mask,
    cho phép áp dụng mặt nạ
  • thuộc tính position,
    cần thiết để clip hoạt động
  • thuộc tính overflow,
    cũng có thể ẩn một phần nội dung
Tiếng Việt
AfrikaansAzərbaycanБългарскиবাংলাБеларускаяČeštinaDanskDeutschΕλληνικάEnglishEspañolEestiSuomiFrançaisहिन्दीMagyarՀայերենIndonesiaItaliano日本語ქართულიҚазақ한국어КыргызчаLietuviųLatviešuМакедонскиMelayuမြန်မာNederlandsNorskPolskiPortuguêsRomânăРусскийසිංහලSlovenčinaSlovenščinaShqipСрпскиSrpskiSvenskaKiswahiliТоҷикӣไทยTürkmenTürkçeЎзбекOʻzbek
Chúng tôi sử dụng cookie để vận hành trang web, phân tích và cá nhân hóa. Việc xử lý dữ liệu được thực hiện tuân theo Chính sách bảo mật.
chấp nhận tất cả tùy chỉnh từ chối