Chỉnh sửa kích thước,màu sắc,độ nghiêng đậm cho chữ trong blog

by Admin Wed Sep 08, 2010 7:47 am

Căn Chỉnh Độ Đậm Nghiêng TRong Blog Toàn Diện Nhất
Để vận dụng đc các giá trị cho chữ áp dụng trong toàn blog hay từng phần bạn cần phải hiểu đc các thuộc tính cho chữ 1 tẹo
Sau đây tôi sẽ giới thiệu sơ qua về 1 số tuỳ chọn cho chữ nhé
a - Đầu tiên là về màu sắc ;

#mã_màu : dùng code này để thay đổi màu chữ

_Về mã màu khi bạn sử dụng dạng #mã_màu tức là dạng mã HEX,.Nếu chưa biết lấy mã màu như thế nào thì có thể xem nhanh Tại Đây

b_Gia trị về kích thước

font-size:"kích thước" :thay đổi kich thước ,phần này chỉ nên áp dụng cho blast thôi hoăc nick name Profile là ổn

c- Độ nghiêng cho chữ

font-style: italic

d- Font chữ :

font-family:Arial/*Comic Sans MS/*hay Arial, Verdanda... */hoặc 1 font chữ mà bạn thích
e_độ đậm nhạt của Font

font-weight: bold; thay đổi độ đậm nhạt cho font chữ ,có thể áp dụng cho toàn blog để tạo chữ đậm
F_ Hiệu ứng nhấp nháy :
(text-decoration:blink)
Hiệu ứng cho chữ nhấp nhấy này chỉ có tác dụng khi bạn duyệt blog bằng Mozilla Firefox còn đối với trình duyệt IE thì tôi hok thấy

Bây giờ là áp dụng vào blog _Lấy ví dụ cho một số phần cơ bản thôi nhá

1_Thay đổi chữ cho toàn blog :
a_chữ
Code:
body{font-weight: bold;color: #mã_màu;}
Dùng code này để thay đổi độ đậm và màu sẵc chữ cho toàn blog

b ) Link:
Code:

a{ font-weight: bold color: #mã_màu;}
Code này thay đổi độ đậm và màu sẵc cho toàn bộ link trong toàn blog

Ngoài ra Bạn còn có th ể thêm font-style: italic thay đổi độ nghiêng cho chữ or font-family font chữ mà bạn th ích ví dụ font-family:Comic Sans MS .................
2_Bl ast

Đối với chữ Blast ko chèn Link :
Code:
#blast .rc_bc .bd {font-weight:bold;font-style:italic;color:#mã_màu;font-size:110%;text-decoration:blink;}

Đối với chữ Blast có chèn link :
Code:

#blast .rc_bc .bd a{font-weight:bold;font-style:italic;color:#mã_màu;font-size:110%;text-decoration:blink;}

Đối với blast tôi áp dụng tất cả các thuộc tính của chữ ở bên .Nếu không thích thuộc tính nào bạn có thể xoá nó đi nhá
Phần font-size:110% là thay đổi cỡ chữ bạn có thể thay lại có thể là 100% or 120% cỡ chữ mà bạn thích

3_Phan Chu Module Profile

#profile_highlight .profileimgbtn a{} _Tai Anh _Có thể bỏ qua
#profile_highlight .nickname a{font-family:Comic Sans MS/*hay Arial, Verdanda... */;color: #mã_màu;} _NickName
#profile_highlight .profilebtn a{} _ Sua Ho So +Có thể bỏ qua
_Module này tôi chỉ lấy ví dụ cho phần Nick name thôi _phần tải ảnh và phần sửa hồ sơ không quan trọng lắm .Nếu thích thì bạn có thể thêm 1 thuộc tính cho chữ nào đó bên trong thẻ {} nhá và mỗi thuộc tính cho chữ đều cách nhau băng dấu ;

_Dưới đây là 29 module trong blog nếu bạn muốn ap dụng riêng các giá trị cho chữ trong module nào hay trong tưng phần module nào thì chỉ copy tên các phần trong module đó bỏ vào Css và thêm các thuộc tính cho chữ mà bạn thích nhá
Note :

_Các giá trị cho chữ phải đặt trong thẻ {} và cách nhau bằng dấu ; U nhá .Nhìn mấy ví dụ trên mà làm theo nài !
_Có thể không nhất thiết phải copy code cho toàn bộ module mà chỉ copy riêng phần nào đó mà bạn muốn thay đổi thôi

Tôi sẽ lấy ví dụ thêm cho các phần comment new ,bình luận nhanh,blog tôi thích nhá
4_Phan Chu Module Blog Toi Thich

Chỉnh sửa kích thước,màu sắc,độ nghiêng đậm cho chữ trong blog 624200933237am

Chỉnh sửa kích thước,màu sắc,độ nghiêng đậm cho chữ trong blog 624200933237am

#subscribe_highlight h2{color: #mã_màu;} Tieu De
#subscribe_highlight .folder li a{font-weight: bold;color: #mã_màu;} Thu Muc
#subscribe_highlight .mod-subscription-list h3 a{color: #mã_màu;} Tieu De Bai Viet
#subscribe_highlight .time{font-weight: bold;color: #mã_màu;} Thoi Diem Dang Bai
#subscribe_highlight p{font-weight: bold;color: #mã_màu;} Noi Dung Tom Tat Bai Viet
#subscribe_highlight .imgctnr a{font-weight: bold;color: #mã_màu;} Nick
5_ Phan Chu Module Binh Luan Moi Nhat
Chỉnh sửa kích thước,màu sắc,độ nghiêng đậm cho chữ trong blog 624200933202am

Chỉnh sửa kích thước,màu sắc,độ nghiêng đậm cho chữ trong blog 624200933202am

#comment_new h2{font-weight: bold;color: #mã_màu;} Tieu De Module
#comment_new strong{font-weight: bold;color: #mã_màu;} Tieu De Bai Viet Co Comment
#comment_new li{font-weight: bold;color: #mã_màu;} Thoi Diem Comment
#comment_new li a{font-weight: bold;color: #mã_màu;} Noi Dung Comment & Nick Comment
#comment_new em a{font-weight: bold;color: #mã_màu;} Tat Ca Loi Binh
6_ Phan Chu Module Binh Luan Nhanh

Chỉnh sửa kích thước,màu sắc,độ nghiêng đậm cho chữ trong blog 624200933215am

Chỉnh sửa kích thước,màu sắc,độ nghiêng đậm cho chữ trong blog 624200933215am

#guestbook_entries h2{font-weight: bold;color: #mã_màu;} _Tieu De
#guestbook_entries h3 a{font-weight: bold;color: #mã_màu;} _ Nick
#guestbook_entries blockquote{font-weight: bold;color: #mã_màu;} _Noi Dung Binh Luan
#guestbook_entries em{font-weight: bold;color: #mã_màu;} _Thoi Diem Binh Luan
#guestbook_entries .more a{font-weight: bold;color: #mã_màu;} _Xem Them
7_Phan Chu Module Thu Muc Rieng

#folder h2{} _Tieu De
#folder a{} _Thu Muc
#folder li {} _So Luong Bai Viet Trong Thu Muc

8_Phan Chu Module Ho So Blog

#profile_card h2{} _Tieu De
#profile_card .name{} _ Ten
#profile_card .about{} _Tu Gioi Thieu
#profile_card .description{} _Mo Ta Blog
#profile_card .hobbies{} _ So Thich
#profile_card .more a{} _Xem Them
9_ Phan Chu Phan Comment
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"

10_Phan Chu Module Bai Viet

#article_list_module strong{} Tieu De Module
#article_list_module form{} Tim Bai Viet
#article_list_module .btn{} Nut Tim
#article_list_module a{} Tieu De Bai Viet,Trich Dan,Sua,Xoa,Ten Thu Muc Chua Bai Viet
#article_list_module .trackback{} Trich Dan
#article_list_module .edit{} Sua
#article_list_module .delete{}Xoa
#article_list_module .mod-alist-folderbar {} Dang Ngay ...
#article_list_module .mod-alist-folderbar .folder{} Thu Muc
#article_list_module .mod-alist-folderbar .folder a{} Ten Thu Muc
.tag_content {} Tim Tag
#article_list_module . tag_content a{} Noi Dung Tim Tag
#article_list_module .mod-alist-tagsbar em a{} Trich Dan
#article_list_module .mod-alist-tagsbar em{} So Trich Dan
#article_list_module .btn_expand_comment {} Tong Cong Loi Binh
.mod-alist-folderbar {} Tieu De Bai Viet Tom Tat
.content{} Noi Dung Bai Viet Tom Tat
#article_list_module .mod-alist .mod-alist-tagsbar em{}Loi Binh | Trich Dan
.total {} Tong So Trang
#article_list_module .pagination .index strong{} Trang Dang Mo
#article_list_module .pagination .index a{} Cac Trang Con Lai
#article_list_module .pagination .index .prev {} Truoc
#article_list_module .pagination .index .next {} Sau

11_Phan Chu Module Thong Ke Plus

#statistic h2{} Tieu De
#statistic li{} Noi Dung Thong Ke

12_ Phan Chu Module Bai Viet Moi Nhat

#article_new h2{} _Tieu De
#article_new a{} _ Bai Viet
13_Phan Chu Module Website Yeu Thich

#mod_bookmark h3{} Tieu De Module
#mod_bookmark h3{} Tieu De Website
14_ Phan Chu Tren Cung Cua Blog
.userlogin{} Xin chao, Nick, Dau | Ngan Cach Thoat/Thong Tin Tai Khoan
.userlogin strong{} Nick
#blog_masshead .userlogin a{} Thoat/Thong Tin Tai Khoan
#blog_masshead .hd .nav a{} Trang chu Blog/Cac cau hoi thuong gap/Yahoo! VietNam
.nav {} Dau | Ngan Cach Trang chu Blog/Cac cau hoi thuong gap/Yahoo! VietNam

15_ Phan Chu Module Ten Va Mo Ta Blog

#blog_title h2{} _Ten Blog
#blog_title p{} _Mo Ta Blog

16_ Phan Chu Module Tam Trang

#mod_lifeline h2{} _ Tieu De
#mod_lifeline ins{} Tu ... den ...

17_Phan Chu Module Tim Kiem

#search_module h2{} Tieu De
#search_module label{} Chi Trong Blog Nay & Y! 360plus

18_ Phan Chu Module Ban Be

#friendlist_module h2{} _ Tieu De
#friendlist_module a{} _Nick
#friendlist_module em a{} Tat Ca

19_Phan Chu Module Hình Ảnh Trong Blog

#photo_highlight h2{} _Tieu De
#photo_highlight a{} _Ten Hinh Anh
#photo_highlight .more a{} _Xem Them

20_ Phan Chu Module Blog Ve Toi

#mod-tagged-frd-article h2{} _Tieu De
#mod-tagged-frd-article li a{} _Tieu De Bai Viet
#mod-tagged-frd-article ins a{} _Nick
#mod-tagged-frd-article em a{} _Tat Ca

21_ Phan Chu Module Cap Nhat Ngay

#update_date h2{} Tieu De
#update_date .date{} Thoi Diem Cap Nhat

22_ Phan Chu Module Lich

#calendar .hd {} Year
#calendar .hd .titlebar .bd a{} Month
#calendar th{} S M T W T F S
#calendar td{} Days Of Month
#calendar td span a{} Ngay Co Bai Viet

23_Phan Chu Module Album

#feature_album h2 a{} Tieu De

24_Phan Chu Module RSS

#rss_output h2 a{} _Tieu De

25_Phan Chu Module Bang Tin Nhan

#feature_link_gb h2 a{} _Tieu De

26_Phan Chu Module Bai Viet Ve Ban Hoac Co Tag Ten Ban

.mod-relatives-1 h2{} _Tieu De
.mod-relatives-1 .info{} Noi Dung

27_Phan Chu Module Nguoi Dang Ky Yeu Thich Blog Nay Cung Dong Thoi Thich

.mod-relatives-2 h2{} Tieu De
.mod-relatives-2 .info{} Noi Dung

28_ Mau, Kieu, Kich Co Va Can Chinh Font Chu Trang Profile

/* phần Chi Tiet Blog */

#blog_profile h2{} Tieu De
#blog_profile .bd th{} Ten Blog, Mo Ta Blog
#blog_profile .bd td{} Noi Dung

/* phần Tu Gioi Thieu */

#introduction_profile h2{} Tieu De
#introduction_profile p{} Noi Dung

/* phần Thong Tin Rieng */

#personal_profile h2{} Tieu De
#personal_profile th{} Nickname, Gioi Tinh, Ten, Quoc Gia, Tuoi, Tu Vi, Nhom Mau, Hoc Van, Truong, To Chuc, Nganh Chuyen Mon, So Thich, Sach Yeu Thich, Phim Yeu Thich, Nhac Yeu Thich, Chuong Trinh TV
#personal_profile td{} Noi Dung Cua Nickname, Gioi Tinh, Ten, Quoc Gia, Tuoi, Tu Vi, Nhom Mau, Hoc Van
#personal_profile td a{} Noi Dung Cua Truong, To Chuc, Nganh Chuyen Mon, So Thich, Sach Yeu Thich, Phim Yeu Thich, Nhac Yeu Thich, Chuong Trinh TV

29_Mau, Kieu, Kich Co Va Can Chinh Font Chu Trang Binh Luan Nhanh, Bang Tin Nhan
#gb_msg h2{} Tieu De Module
#gb_msg .gbmsg_btn a{} Tra Loi
#gb_msg .c_gbmsg a{} Nick
#gb_msg .bd{} Thoi Diem Binh Luan
#gb_msg p{} Noi Dung Binh Luan
#gb_msg .total{} Tong So Trang
#gb_msg .pagination .index strong{} Trang Dang Mo
#gb_msg .pagination .index a{} Cac Trang Con Lai
#gb_msg .pagination .index .prev {} Truoc
#gb_msg .pagination .index .next {} Sau

Nói chung thì tuỳ bạn vần dụng các mã màu font chữ ,độ đậm nhạt của font sao cho hợp lý thôi ,có chỗ chỉ cầcn mã màu ,hoặc có chỗ thì thêm font chữ .Vận dụng sao cho hợp lý

Lưu ý Lần Cuối

.Là không nhất thiết là phải thay cho toàn bộ module .Nếu bạn thích thay phần nào thì chỉ lấy phần đó bỏ vào css và thêm các giá trị cho chữ mà bạn thích vào bên trong thẻ {} và mỗi thuộc tính cho chữ cách nhau bằng dấu ; U nhá .