Quan trọng
Đăng ngày: 16:06 15-06-2009
Chắc các bạn vào blog mình cũng
thấy các đường viền bao quanh mỗi avatar trong danh sách friendlist của
mình nhỉ ? Vậy các bạn có muốn làm giống vậy không ?? Nếu muốn thì chúng ta cùng làm nhé :
Sau đây là cách thực hiện :1> Thêm viền cho mỗi avatar :
Rất đơn giản, các bạn chỉ việc thêm đọan Code này vào nhé :
Code:
#friendlist_module .rc_bd .rc_bc .hd{height:auto;} #friendlist_module .rc_bd .rc_bc .bd ul li{border-top:2px dotted #fff;border-right:2px dotted #fff;border-left:2px dotted #fff;} #friendlist_module .rc_bd .rc_bc .bd ul li:hover{border-top:2px dotted #000;border-right:2px dotted #000;border-left:2px dotted #000;}
|
- #fff là mã màu trắng, #000 là màu đen, các bạn có thể thay đổi cho phù hợp với theme của mình nhé . Nếu không biết cách chọn mã màu có thể tham khảo Software này nhé !
- #friendlist_module .rc_bd .rc_bc .bd ul li là thuộc tính của viền lúc ban đầu
- #friendlist_module .rc_bd .rc_bc .bd ul li:hover là thuộc tính của viền khi rê chuột vào.
2> Thêm ảnh nền cho các avatar :
Các bạn thay link ảnh nền vào nhé :
Code:
#friendlist_module .rc_bd .rc_bc .hd{height:auto;} #friendlist_module .rc_bd .rc_bc .bd ul li{background:transparent url(Link ảnh nền);} #friendlist_module .rc_bd .rc_bc .bd ul li:hover{background:transparent url(Link ảnh nền);}
|
Có thể sử dụng 2 ảnh nền khác nhau:
- Link màu xanh là ảnh ban đầu
- Link màu đỏ là ảnh xuất hiện khi rê chuột vào.