<shape>
Deprecated: This feature is no longer recommended. Though some browsers might still support it, it may have already been removed from the relevant web standards, may be in the process of being dropped, or may only be kept for compatibility purposes. Avoid using it, and update existing code if possible; see the compatibility table at the bottom of this page to guide your decision. Be aware that this feature may cease to work at any time.
Kiểu dữ liệu <shape> trong CSS là một kiểu dữ liệu xác định hình dạng cụ thể (shape) của một vùng. Vùng này đại diện cho phần của phần tử mà thuộc tính clip áp dụng.
Note:
<shape> và rect() hoạt động kết hợp với clip, đã bị phản đối để ủng hộ clip-path. Khi có thể, hãy sử dụng clip-path và kiểu dữ liệu <basic-shape> thay thế.
Cú pháp
Kiểu dữ liệu <shape> được chỉ định bằng hàm rect(), tạo ra một vùng ở dạng hình chữ nhật.
rect()
rect(top, right, bottom, left)
Giá trị
- top
-
Là
<length>đại diện cho độ dịch chuyển cho cạnh trên của hình chữ nhật tương đối với viền trên của hộp phần tử. - right
-
Là
<length>đại diện cho độ dịch chuyển cho cạnh phải của hình chữ nhật tương đối với viền trái của hộp phần tử. - bottom
-
Là
<length>đại diện cho độ dịch chuyển cho cạnh dưới của hình chữ nhật tương đối với viền trên của hộp phần tử. - left
-
Là
<length>đại diện cho độ dịch chuyển cho cạnh trái của hình chữ nhật tương đối với viền trái của hộp phần tử.
Nội suy
Khi được hoạt hình, các giá trị của kiểu dữ liệu <shape> được nội suy theo các thành phần top, right, bottom, và left của chúng, mỗi thành phần được xử lý như một số thực dấu phẩy động. Tốc độ nội suy được xác định bởi hàm easing liên quan đến hoạt hình.
Ví dụ
Ví dụ minh họa cách sử dụng đúng hàm rect()
img.clip04 {
clip: rect(10px, 20px, 20px, 10px);
}
Thông số kỹ thuật
| Specification |
|---|
| Cascading Style Sheets Level 2 # value-def-shape |
Khả năng tương thích trình duyệt
Xem thêm
- Thuộc tính CSS liên quan:
clip