Thuộc tính z-index CSS
Thí dụ
Đặt chỉ số z cho hình ảnh:
img
{
position: absolute;
left: 0px;
top: 0px;
z-index: -1;
}
Định nghĩa và Cách sử dụng
Thuộc z-index
tính chỉ định thứ tự ngăn xếp của một phần tử.
Phần tử có thứ tự ngăn xếp lớn hơn luôn đứng trước phần tử có thứ tự ngăn xếp thấp hơn.
Lưu ý: z-index
chỉ hoạt động trên các phần tử được định vị (vị trí: tuyệt đối, vị trí: tương đối, vị trí: cố định hoặc vị trí: dính) và các mục linh hoạt (phần tử là con trực tiếp của
hiển thị: phần tử flex ).
Lưu ý: Nếu hai phần tử được định vị chồng lên nhau mà không z-index
được chỉ định, phần tử được định vị cuối cùng trong mã HTML sẽ được hiển thị ở trên cùng.
Giá trị mặc định: | Tự động |
---|---|
Thừa hưởng: | không |
Hoạt hình: | Đúng. Đọc về hoạt hình |
Phiên bản: | CSS2 |
Cú pháp JavaScript: | đối tượng .style.zIndex = "- 1" |
Hỗ trợ trình duyệt
Các số trong bảng chỉ định phiên bản trình duyệt đầu tiên hỗ trợ đầy đủ thuộc tính.
Property | |||||
---|---|---|---|---|---|
z-index | 1.0 | 4.0 | 3.0 | 1.0 | 4.0 |
Cú pháp CSS
z-index: auto|number|initial|inherit;
Giá trị tài sản
Value | Description | Play it |
---|---|---|
auto | Sets the stack order equal to its parents. This is default | |
number | Sets the stack order of the element. Negative numbers are allowed | |
initial | Sets this property to its default value. Read about initial | |
inherit | Inherits this property from its parent element. Read about inherit |
Các trang liên quan
Hướng dẫn CSS: Định vị CSS
Tham chiếu DOM HTML:
thuộc tính zIndex