Yahoo 360 Plus: Làm đẹp cho khung Comment + Toolbar của Blog

Fairstar | 02-04-2011 | nhận xét

Lần trước mình đã giới thiệu cho các bạn bộ sưu tập hình nền đẹp cho Blog Yahoo 360 Pluss hôm nay mình tiếp tục giới thiệu cho các bạn cách Làm đẹp cho khung Comment + Toolbar của Blog

Bạn có thể xem hình Demo ở bên dưới hoặc VÀO ĐÂY để xem trên Blog đã áp dụng

Code của thủ thuật

.rte_toolbar {
background:#d7d7d7 url(link Hinh) repeat-x top;
border-left:1px solid #0448f6;
border-top:1px solid #0448f6;
border-right:1px solid #0448f6;
height:89px;}

-Thay cái link Hinh bằng link ảnh làm nền của bạn nha.

-Chèn vào trong mục "Thiết kế/Theme/Chế độ tự sửa/CSS.

Sau đây là một số link hình tham khảo:

Muốn lấy hình nào các bạn click chuột phải vào hình đó và coppy link

Nếu dùng firefox thì coppy ở dòng Location

Nếu dùng IE thfi coppy ở dòng Address(URL)

 

Các bạn có thể xem thêm các hình khác TẠI ĐÂY

Đây la cách làm trong suốt toàn bộ nền comment:

1 Làm trong suốt tòan bộ nền comment :

 Muốn làm trong suốt tòan bộ nền comment của Entry, các bạn có thể dùng Code sau, paste vào CSS nhe :

       Code

.cmt-mod-alist #comments-listing .extend-hd, .cmt-mod-alist #comments-listing .extend-bd .alist-comment {background:none;} .alist-comment #comment_container *, .cmt-mod-alist #comments-listing , .cmt-mod-alist #comments-listing .alist-comment {background:none;}

2Thay nền comment :

Đối với một số bạn, thì lại thích thay nền phần này, vì vậy mình cũng cung cấp code cho các bạn thay như sau :

Code

.cmt-mod-alist #comments-listing .extend-hd, .cmt-mod-alist #comments-listing .extend-bd .alist-comment {background:none;} .cmt-mod-alist #comments-listing , .cmt-mod-alist #comments-listing .alist-comment {background:none;} .mod-alist-full .alist-comment li {background:transparent url(Link Ảnh);}

3 Thay đổi màu sắc khung viền của comment :

Đây là Code thay đổi màu sắc, kích thước các border xung quanh Comment :

Code

.mod-alist-full .alist-comment li {border-top-width:2px;border-right-width:2px;border-bottom-width:2px;border-left-width:2px;border-top-style:inset;border-right-style:inset;border-bottom-style:inset;border-left-style:inset;border-top-color:#fff;border-right-color:#fff;border-bottom-color:#fff;border-left-color:#fff;}

4 Màu chữ, link trong comment :

Để thay màu sắc chữ và link trong ô comment các bạn có thể dùng Code sau :

Code

#comment_container * a {color:#ma_mau;} #comment_container * .content {color:#ma_mau;} #comments-listing * ins {color:#ma_mau;}

• #ma_mau : là màu link.
• #ma_mau : là màu chữ
• #ma_mau : là màu của dòng : "cách đây... fút"

Thay các dòng #mã_màu bằng mã màu mình thích nhé !!

Thay Đổi Button (nút bấm) "Lưu" "Huỷ" trong phần comment

Demo:

Code

.cmt-mod-alist .add-comment em.buttons input{color:#000000;height:Apx;text-align:center;background:url(Link) no-repeat;}

A: chiều cao của hình.

chúc thành công!