CÔNG TY TNHH Thiết bị HOÀNG THANH
Gallery
Liên Hệ Hoàng Thanh
gpextreme@yahoo.com 0903 398 881
Ngày đăng: 30/05/2013 . Số lần xem: 1282

Bài 15: Layers CSS hoạt động trên cả 3 chiều: cao, rộng, sâu. Hai chiều đầu tiên, chúng ta đã được nhìn thấy trong các bài học trước. Trong bài học này, chúng ta sẽ được học về cách đặt các thành phần web ở các lớp khác nhau với thuộc tính z-index.

Nói đơn giản hơn thì đó là cách bạn đặt một thành phần này lên trên một thành phần khác.

 

Với mục đích này, bạn sẽ gán cho mỗi phần tử một con số. Theo đó, phần tử có số

cao hơn sẽ nằm trên, phần tử có số thấp hơn sẽ nằm dưới.

 

Ví dụ sau chúng ta sẽ đặt 5 bức ảnh logo ở 5 lớp.

 

#logo1 {

position:absolute;

top:70px;

left:50px;

z-index:1

}

#logo2 {

position:absolute;

top:140px;

left:100px;

z-index:2

}

#logo3 {

position:absolute;

top:210px;

left:150px;

z-index:3

}

#logo4 {

position:absolute;

top:280px;

left:200px;

z-index:4

}

#logo5 {

position:absolute;

top:350px;

left:250px;

z-index:5

}

Có thể bạn muốn xem

MỘT LẦN RA PHỐ (30/05/2013)
THẰNG BÉ (30/05/2013)
MÓN QUÀ CỦA CHA (30/05/2013)
KHOẢNG CÁCH (30/05/2013)
CHÚ CHÓ TRUNG THÀNH (30/05/2013)
SỢ (30/05/2013)
HẠNH PHÚC VÔ HÌNH (30/05/2013)
Bài 14: Position (30/05/2013)
MÓN QUÀ (30/05/2013)