Trang trí logo Plus và khung tìm kiếm

Thư mục: Yahoo! 360Plus |

Quan trọng
Đăng ngày: 16:00 21-03-2009

Sau khi nghỉ ngơi ít ngày, olympia đã lại có thêm 1 số thủ thuật cho các bạn.

Trước hết là trang trí thêm cho logo Plus ở góc trái trên cùng blog.

Vì logo là hình trong suốt nên bạn có thể chèn hình nền phía sau cho logo. olympia khuyên bạn nên chọn hình động tựa tựa như hiệu ứng tuyết rơi. Tham khảo thư viện hover ở đây >>> http://vn.myblog.yahoo.com/olympia41124/article?mid=1860

Còn đây là code CSS :

#blog_masshead div.mhlogo a {background:url(http://i118.photobucket.com/albums/o93/olympia41124/Yahoo_360plus/Hover/2.gif);}

Bạn có thể thay link http://i118.photobucket.com/albums/o93/olympia41124/Yahoo_360plus/Hover/2.gif bằng link hình của bạn.

Tiếp theo là khung tìm kiếm ở module tìm kiếm

Code CSS :

#search_module input.textfield
{background:transparent url(http://i118.photobucket.com/albums/o93/olympia41124/Yahoo_360plus/Hover/2.gif);border-top-color:#0000FF;border-left-color:#0000FF;border-right-color:#0000FF;border-bottom-color:#0000FF;}

Khung tìm kiếm ở module bài viết:

Code phần này:

.mod-alist-searchbox input.ipt
{background:transparent url(http://i118.photobucket.com/albums/o93/olympia41124/Yahoo_360plus/Hover/2.gif);border-top-color:#0000FF;border-left-color:#0000FF;border-right-color:#0000FF;border-bottom-color:#0000FF;}

Khung tìm kiếm trên cùng của blog :

Code CSS :

#blog_masshead .bd form input.ipt{background:transparent url(http://i118.photobucket.com/albums/o93/olympia41124/Yahoo_360plus/Hover/2.gif);border-top-color:#FFFFFF;border-left-color:#FFFFFF;border-right-color:#FFFFFF;border-bottom-color:#FFFFFF;}

Ở các phần trên các bạn có thể thay màu đường viền của khung tìm kiếm, hoặc nếu không thích các bạn có thể bỏ phần màu của đường viền đi.

Bản quyền bài viết thuộc về olympia41124, đề nghị ghi rõ nguồn khi trích dẫn.

Trích dẫn (1)

Tìm tag: Trang trí, Logo, Plus, Khung tìm kiếm

Tổng cộng 1 Nguồn trích