28 Jan

Rate this post

Thuộc tính layer trong css có 3 chiều: cao, rộng và sâu.  Chiều cao và rộng thì như các bạn đã biết ở các bài học trước đó là thuộc tính width và thuộc tính height. Hôm nay mình sẽ nói thêm thuộc tính chiều sâu đó là z-index: <giá trị> ở đây giá trị là các con số cho phép xuất hiện trước và sau, số nhỏ thì sẽ xuất hiện trước và số lớn thì sẽ xuất hiện sau. Ở bài Thuộc tính position trong css mình cũng có nói đến thuộc tính z-index nay mình sẽ làm ví dụ cụ thể để các bạn hiểu hơn.

Ví dụ mình sẽ tạo ra 4 khối

Kết quả sử dụng thuộc tính layer
Thuộc tính layer trong CSS

Nếu chúng ta thay đổi giá trị của z-index thì sẽ nhận được kết quả khác.Ví dụ vẫn sử dụng đoạn code trên nhưng ở
khối 1 z-index: 3
khối 2 z-index: 1
khối 3 z-index: 2
khối 4 z-index: 4
thì kết quả sẽ nhận được là
Thuộc tính layer trong CSS
Như ở trên mình có nói. Số nhỏ sẽ xuất hiện trước và số lớn sẽ xuất hiện sau. Chúc các bạn thành công

Các từ khóa liên quan bài viết:
thuộc tính z-index trong css
thuộc tính z-index
thuộc tính z-index html
sử dụng thuộc tính z-index
thuộc tính z-index html