Thay Nút "Thêm Bạn", "Blog ưa thích"

Mã:
DIV.addfrdbtn A.addtofriends{background:url(Link ảnh ADD BLOG - Thêm bạn) no-repeat center;height:22px;}

DIV.subscribebtn A.add_subscription{background:url(Link ảnh Blog ưu thích) no-repeat center;height:22px;}
Height là chiều dài, chiều cao của ảnh. Sau khi đăng suất khỏi blog, các bạn vào lại blog sẽ thấy nút của "Thêm bạn" và "Blog ưu thích" đã được thay.

Tạo nút Home

Mã:
div.backhomtbtn a.backtomyblog {background:url(http://i280.photobucket.com/albums/kk193/datablog/210738home_icon_-1.png) no-repeat center;height:48px;}

Thay height là chiều cao của ảnh

Thay đổi icon Bình luận riêng

Mã:
.mod-list-titlebar .lock {background:url(http://img.photo.zing.vn/file_uploads/gallery/sources/q42008/2009/05/27/11/47581243440976.png) no-repeat left bottom;}
dùng được Ảnh có kích cỡ ko vượt quá 14x14


Thay đổi icon Tổng cộng lời bình

Mã:
.cmt-mod-alist .extend-hd A {background:url(http://img.photo.zing.vn/file_uploads/gallery/sources/q42008/2009/05/16/06/84531242474255.png) no-repeat;}


Ảnh nền tổng số trang, cuối modun bài viết

Mã:
.mod-comment-new .pagination, .mod-alist-summary .pagination, .mod-alist-full .pagination{background:transparent url(Link ảnh);}
Ngăn dòng bài viết

Xoá đường ngăn dòng

Mã:
.mod-alist-summary .main-bd li{border-top:none}
Thay đường ngăn dòng bằng Hình Ảnh
Mã:
.mod-alist-summary .main-bd li{border-top:none;background:url(Link Ảnh) no-repeat bottom;}
Code tạo ngăn dòng cho trả lời commnet

Mã:
.mod-alist-full .alist-comment .responding {border-top-style:none;background:url(http://img.photo.zing.vn/file_uploads/gallery/sources/q42008/2009/05/16/04/64831242466500.png) no-repeat right top;}


Xóa đường viền các modun trong blog

Mã:
#friend-list .rc div, #friendlist_module .rc div, .rc div,.col-150 .rc div {background:transparent;}
#friend-list .rc, #friendlist_module .rc, .rc,.col-150 .rc {background:transparent;}
#friend-list .rc_bd div.rc_bc, #friendlist_module .rc_bd div.rc_bc, .rc_bd div.rc_bc,.col-150 .rc_bd {background:transparent;}
#friend-list .rc_bd, #friendlist_module .rc_bd, .rc_bd,.col-150 .rc_bd div.rc_bc {background:transparent;}
#friend-list .rc_ft div, #friendlist_module .rc_ft div,  .rc_ft div, .col-150 .rc_ft div {background:transparent;}
#friend-list .rc_ft, #friendlist_module .rc_ft, .rc_ft, .col-150 .rc_ft {background:transparent;}
Tạo đường viên trong suốt



Mã:
#friend-list .rc div, #friendlist_module .rc div, .rc div, #subscribe_highlight .rc div, #mod-tagged-frd-article .rc div {background:url(http://i461.photobucket.com/albums/qq334/changtraiiudoiblog/mini%20pro/rc_ne-2.png) no-repeat right bottom;}

#friend-list .rc, #friendlist_module .rc, .rc, #subscribe_highlight .rc, #mod-tagged-frd-article .rc {background:url(http://i461.photobucket.com/albums/qq334/changtraiiudoiblog/mini%20pro/rc_nw.png) no-repeat left bottom;}

#friend-list .rc_bd div.rc_bc, #friendlist_module .rc_bd div.rc_bc, .rc_bd div.rc_bc, #subscribe_highlight .rc_bd div.rc_bc, #mod-tagged-frd-article .rc_bd div.rc_bc {background:url(http://i461.photobucket.com/albums/qq334/changtraiiudoiblog/mini%20pro/rc_e.png) repeat-y right top;}

#friend-list .rc_bd, #friendlist_module .rc_bd, .rc_bd, #subscribe_highlight .rc_bd, #mod-tagged-frd-article .rc_bd {background:url(http://i461.photobucket.com/albums/qq334/changtraiiudoiblog/mini%20pro/rc_w.png) repeat-y;}

#friend-list .rc_ft div, #friendlist_module .rc_ft div, .rc_ft div, #subscribe_highlight .rc_ft div, #mod-tagged-frd-article .rc_ft div {background:url(http://i461.photobucket.com/albums/qq334/changtraiiudoiblog/mini%20pro/rc_se-2.png) no-repeat right top;}

#friend-list .rc_ft, #friendlist_module .rc_ft, .rc_ft, #subscribe_highlight .rc_ft, #mod-tagged-frd-article .rc_ft {background:url(http://i461.photobucket.com/albums/qq334/changtraiiudoiblog/mini%20pro/rc_sw.png) no-repeat left top;}

#blast .rc_ft {background:url(http://i306.photobucket.com/albums/nn275/changtraiiudoi/DataBlog/blast-sw.png) no-repeat left bottom;}

#blast .rc_ft div {background:url(http://i306.photobucket.com/albums/nn275/changtraiiudoi/DataBlog/blast-se.png) no-repeat right bottom;}#blast .rc_bc .bd{background-color:transparent;background-image:url(http://i306.photobucket.com/albums/nn275/changtraiiudoi/042112transparent_bg.png);}

#blast .rc_bc .bd {font-style:italic;color:#000000;}
Tạo lời nhắc nhở, không post nhạc auto, không post chữ và ảnh quá lớn

Mã:
.rte_src_editor {BACKGROUND: url(link ảnh nhắc nhở) no-repeat top left;}
Khi click vào ô HTML, lập tức suốt hiện một lời thông báo rằng: ko nên post nhạc auto, ko nên post chữ, ảnh quá lớn, code css chỉ đơn giản là:



Hiệu ứng thu nhỏ, tự động kéo dài modun tự tạo khi để chuột vào

Code này sẽ giúp bạn thu ngắn modun tự tạo chỉ để nó hiện ra 1 chiều dài nhất định, khi di chuột vào modun đó, nó sẽ tự động kéo dài modun đó ra. Chúng ta có thể thấy ngay một ứng dụng rất hay, đó là tạo 1 list nhạc rất dài ở modun tự tạo, nhưng chúng ta chỉ để nó hiện ra 1 chiều dài nhất định, khi người nghe để chuột vào modun đó, nó sẽ tự động kép dài và hiện thị đầy đủ nội modun đó.

Code css:
Mã:
#user_mod_1000X .rc_bd .rc_bc .bd .user-mod-holder
{height:200px;}

#user_mod_1000X .rc_bd .rc_bc .bd .user-mod-holder:hover
{height:auto;}
X là giá trị của modun tự tạo từ 1 đến 10.

200px là giá trị bạn muốn nó hiện thị, chúng ta có thể tùy ý thay đổi.


Hiệu ứng thu nhỏ chữ và tự động phóng to ảnh khi để chuột vào

Code giúp thu nhỏ chữ và ảnh. Khi di chuột đến, chữ và ảnh sẽ tự động chở về đúng kích cỡ.

Để làm được như vậy, bước đầu tiên, ta copy code này, dán vào css

• Code này dán vào css để sử dụng được hiệu ứng phóng to ảnh, thu nhỏ chữ:
Mã:
#blog_quote{font-size:5px;font-style:italic;color:#FF99FF;background:#000066;}#blog_quote:hover {font-size:12px;font-weight:bold;font-style:normal;color:#CC99AA;background:transparent;}#blog_img img {height:100px;}#blog_img img:hover {height:100%;}

Tạo hiệu ứng nút bấm Lưu & Hủy commnet

Code css:
Mã:
.cmt-mod-alist .add-comment em.buttons input {text-align:center;background:url(http://img.photo.zing.vn/file_uploads/gallery/sources/q42008/2009/04/30/03/50521241078926.png) no-repeat;}



Làm trái tim, mưa, tuyết rơi, bướm bay... khi di chuột vào các link trong blog
Mã:
a:hover {text-decoration:none;color:#EE4949;text-decoration:none;background-image:url(link ảnh);}



[Text Color]
Code sửa lỗi phông chữ, blog bị đen khi làm trong suốt.
Mã:
mod-alist-full .pagination{background:transparent;



anh em chú ý nè vanhoai nói trước nhé cái code này chỉ sửa lỗi cho blog của bạn nào khi làm trong suốt rùi nhưng mà cái mudule bài viết vẫn chưa trong suốt hoàn toàn tức là nó bị đen nhìn mờ mờ ý mà và code này phát huy tác dụng tốt nhất khi bạn phải bỏ ở cuối phần CSS của mình đó nha!!!

Tạo hiệu ứng truyết rơi (tràn khắp blog)

Mã:
HTML {background:url(Link Ảnh Nền Toàn Bộ Blog) center fixed;}

#vitality_updates, body.vitality_updates, body.profile_view, body.blog_my body.guestbook, body.comment_list, body.comment_list, body.blog_my_index, body.slideshow, body.blog_archives_folder, body.comment_listing, body.trackback_listing, body.post_doodle, body.guestbook, body.blog_archives_date, body.blog_archives_all, body.post_rte, body.subscribe_list, body.post_gb, body.gallery, body.photo_big, body.photo_upload_pc, body.photo_upload_gallery, body.blog_my {background:url(http://img.photo.zing.vn/file_uploads/gallery/sources/q42008/2008/12/15/08/73861229306026.gif);}
Đổi màu chữ cái đầu dòng

Mã:
h2:first-letter {color:#FFFFFF;font-size:large;}


Tạo theme 2 mảnh Top - Bottom cho modun bài viết

Mã:
.mod-alist-full .main-hd{background:url(http://img.photo.zing.vn/file_uploads/gallery/w642h/q42008/2009/01/08/01/63041231353592.png) no-repeat;}

.mod-alist-full .main-bd{background:#FFFFFF url(http://img.photo.zing.vn/file_uploads/gallery/w642h/q42008/2009/01/08/12/10871231347975.png) repeat-x bottom fixed;}

hoặc:

Mã:
 #article_list_module .main-hd{background:url(http://img.photo.zing.vn/file_uploads/gallery/w642h/q42008/2009/01/08/01/63041231353592.png) no-repeat;}

#article_list_module .main-bd{background:#FFFFFF url(http://img.photo.zing.vn/file_uploads/gallery/w642h/q42008/2009/01/08/12/10871231347975.png) repeat-x bottom fixed;}
Lưu ý fixed trong code trên có tác dụng làm đứng ảnh (ảnh ko chuyển động trong bài viết) khi ta cuộn trang web. Các bạn có thể dùng hoặc ko dùng fixed


6. Làm sao thay theme và cho theme đứng yên khi kéo chuột ?

Dùng đoạn code CSS sau
Mã:
body.blog_my, body.blog_my_index, body.comment_listing, body.trackback_listing, body.blog_archives_folder, body.blog_archives_date, body.blog_archives_all, body.post_rte, body.post_doodle, body.guestbook, body.comment_list, body.subscribe_list, body.post_gb, body.profile_view, body.gallery, body.photo_big, body.slideshow, body.photo_upload_pc, body.photo_upload_gallery{background:#FFFFFF url(http://wallcoo.net/cartoon/Digital_Spring_Art_1920x1200/wallpapers/1280x800/Digital_composite_spring_2013.jpg) repeat fixed;}

Hoặc đoạn code này:

*hinh toan blog*
Mã:
BODY.blog_my {background:url(http://sg.yimg.com/i/vn/blog/i/blog/cat4_5.gif) #000000 fixed;}

BODY.blog_my {BACKGROUND:url(http://sg.yimg.com/i/vn/blog/i/blog/cat4_5.gif) #000000 fixed;}


Thay
Mã:
- http://wallcoo.net/cartoon/Digital_Spring_Art_1920x1200/wallpapers/1280x800/Digital_composite_spring_2013.jpg bằng link hình nền của bạn nhé.
-http://sg.yimg.com/i/vn/blog/i/blog/cat4_5.gif  bằng link hình nền của bạn