Ý nghĩa 1 số Code CSS cho việc thiết kế theme

by **meocon** Fri Jun 05, 2009 6:46 pm

1 Số đoạn CSS và ý nghĩa của chúng :

/* Màu của link và màu khi di chuột qua link */
a{color:#6F5F06;}
a:hover{color:#FF0000;}

/* Background - PHẦN NỀN TRANG */

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 of the page
Thay http://farm3.static.flickr.com/2025/2441940811_b2bffcbf58_o.gif bằng link ảnh nền
mà bạn thích. Tùy chọn REPEAT để các bạn cho phép ảnh tràn toàn bộ
phần nền trang của mình
*/
{ background: #C4C1B7 url(http://farm3.static.flickr.com/2025/2441940811_b2bffcbf58_o.gif) repeat; }

/* Blog title TIÊU ĐỀ BLOG */

#blog_title h2 { color:#FF5500; }
/*Background of header Bar
phần này để thay hình nền cho phần Tiêu đề blog
Thay http://farm4.static.flickr.com/3172/2442781036_c7945301da_o.gif bằng link ảnh mà bạn thích. Kích thước tốt nhất là 1024x50 (dài x cao)
NO-REPEAT: Ảnh chỉ hiện 1 lần, ko tràn khắp.
top right: ảnh sẽ được để căn bên phải, từ trên xuống
*/
#blog_title .bd {background:url(http://farm4.static.flickr.com/3172/2442781036_c7945301da_o.gif) top right no-repeat;background-color:#7D7A6F; color:#FF5500; }

/* Secondary module header
PHẦN HEADER cho các module phụ trợ (BÊN TRÁI và BÊN PHẢI)
Thay http://farm4.static.flickr.com/3147/2442840288_d825924990_o.gif bằng link ảnh mà bạn thích cho làm ảnh nền phần tiêu đề của các module
*/

.col-150 .rc_bd .rc_bc .hd .titlebar .hd,

.col-150 .rc_bd .rc_bc .hd .titlebar /* JW */

{background:url(http://farm4.static.flickr.com/3147/2442840288_d825924990_o.gif); }

.col-150 .rc_bd .rc_bc .hd .titlebar .hd h2, .col-150 .rc_bd .rc_bc .hd .titlebar .hd a /* JW */

{color:#4A480C; }

.col-150 .hd .titlebar .hd a:hover /* JW */

{color:;text-decoration: underline; }

/* Secondary module content
Phần nội dung phía dưới các tiêu đề của các module phụ.
Thay http://farm4.static.flickr.com/3010/2442834080_9b99a54f7c_o.gif bằng link ảnh nền cho module phụ nhé.
*/

.col-150 .rc_bd .rc_bc .bd /* JW */

{ background:url(http://farm4.static.flickr.com/3010/2442834080_9b99a54f7c_o.gif) repeat; color:#777777;}

#calendar .hd .titlebar .hd, #calendar .hd .titlebar .bd a,

{ color:#; }

#calendar .bd td strong { color:#787363; }

/* Primary module header */
.col-600 .rc_bd .rc_bc .hd .titlebar, /*JW*/
.row-920 .rc_bd .rc_bc .hd .titlebar, /*JW*/
.row-760 .rc_bd .rc_bc .hd .titlebar /*JW*/

{ background:url(http://farm4.static.flickr.com/3147/2442840288_d825924990_o.gif) repeat; color:#666666;}

/* Primary module content */

.col-600 .rc_bd .rc_bc .bd,.col-600 .rc_bd .rc_bc .ft, /*JW*/
.row-920 .rc_bd .rc_bc .bd,.row-920 .rc_bd .rc_bc .ft, /*JW*/
.row-760 .rc_bd .rc_bc .bd,.row-760 .rc_bd .rc_bc .ft /*JW*/

{ background:url(http://farm4.static.flickr.com/3010/2442834080_9b99a54f7c_o.gif) repeat; color:#666666; }

#canon_profile_highlight .bd {

padding-top:10px;

BACKGROUND: # COLOR: #;
}

#canon_profile_highlight .bd A{
COLOR: #;
}

#m_article_list_full A, #m_article_list_full A:hover{

COLOR: #; background:url(http://farm4.static.flickr.com/3010/2442834080_9b99a54f7c_o.gif) repeat;

}

#blast A, #blast A:hover{
/*MÀU CỦA LINK VÀ MÀU KHI DI CHUỘT QUA LINK TRÊN BLAST*/
COLOR: #FF0000;
}

/*-------- Bookmark CSS --------*/

.col-150 .bookmark{width:150px;text-align:left;}
.col-150 .bookmark .rc_1{background:url(http://hk.l.yimg.com/hk.yimg.com/i/blog/mod-bookmark150t1c1-hd.gif) no-repeat 0 0;padding:72px 0 0 0;}
.col-150 .bookmark .rc_2{background:url(http://hk.l.yimg.com/hk.yimg.com/i/blog/mod-bookmark150t1c1-ft.gif) no-repeat left bottom;padding:0 0 13px 0;}
.col-150 .bookmark .rc_3{}
.col-150 .bookmark .rc_4{background:#ffcccc;}
.col-150 .bookmark .rc_5{padding:0 4px;}
.col-150 .bookmark .rc_6{}
.col-150 .bookmark .ctnr{}
.col-150 .bookmark .new_rc{display:none;}
.col-150 .bookmark .new_rc div{}
.col-150 .bookmark .new_rc_bd{background:#e9a5b0;}
.col-150 .bookmark .new_rc_bc{background:#ffefef;margin:1px;}
.col-150 .bookmark .new_rc_ft{display:none;}
.col-150 .bookmark .new_rc_ft div{}
.col-150 .bookmark .ctnr h3{font-weight:bold;font-size:12px;padding:10px 5px;color:#666;}
.col-150 .bookmark ul{list-style:none;}
.col-150 .bookmark ul li{width:118px;overflow:hidden;background:url(http://hk.l.yimg.com/hk.yimg.com/i/blog/mod-ico-li-1.gif) no-repeat 2px 5px;padding:0 0 10px 10px;margin:3px;font-size:10px;*font-size:11px;}
.col-150 .bookmark ul li a{color:#61187f;text-decoration:none}
.col-150 .bookmark ul li a:hover{color:#61187f;text-decoration:underline;}

.col-600 .bookmark{width:600px;text-align:left;}
.col-600 .bookmark .rc_1{background:url(http://hk.l.yimg.com/hk.yimg.com/i/blog/mod-bookmark600t1c1-sw.gif) no-repeat 0 bottom;}
.col-600 .bookmark .rc_2{background:url(http://hk.l.yimg.com/hk.yimg.com/i/blog/mod-bookmark600t1c1-nw.gif) no-repeat 0 0;padding:0 0 0 15px;}
.col-600 .bookmark .rc_3{background:url(http://hk.l.yimg.com/hk.yimg.com/i/blog/mod-bookmark600t1c1-se.gif) no-repeat right bottom;}
.col-600 .bookmark .rc_4{background:url(http://hk.l.yimg.com/hk.yimg.com/i/blog/mod-bookmark600t1c1-ne.gif) no-repeat right top;}
.col-600 .bookmark .rc_5{padding:0 56px 0 0;}
.col-600 .bookmark .rc_6{background:#ffcfcf;padding:6px 18px 6px 0;}
.col-600 .bookmark .ctnr{}
.col-600 .bookmark .new_rc{display:none;}
.col-600 .bookmark .new_rc div{}
.col-600 .bookmark .new_rc_bd{background:#d495a0;padding:1px;}
.col-600 .bookmark .new_rc_bc{background:#fff0f1;}
.col-600 .bookmark .new_rc_ft{display:none;}
.col-600 .bookmark .new_rc_ft div{}
.col-600 .bookmark .ctnr h3{font-weight:bold;font-size:14px;padding:10px 5px;color:#666;}
.col-600 .bookmark ul{list-style:none;}
.col-600 .bookmark ul li{float:left;width:142px;height:38px;overflow:hidden;background:url(http://hk.l.yimg.com/hk.yimg.com/i/blog/mod-ico-li-1.gif) no-repeat 2px 5px;padding:0 0 5px 13px;margin:0 6px;font-size:12px;*font-size:11px;}
.col-600 .bookmark ul li a,.col-600 .bookmark ul li a:hover{color:#60177e;}

.row-760 .bookmark{width:760px;text-align:left;}
.row-760 .bookmark .rc_1{background:url(http://hk.l.yimg.com/hk.yimg.com/i/blog/mod-bookmark600t1c1-sw.gif) no-repeat 0 bottom;}
.row-760 .bookmark .rc_2{background:url(http://hk.l.yimg.com/hk.yimg.com/i/blog/mod-bookmark600t1c1-nw.gif) no-repeat 0 0;padding:0 0 0 15px;}
.row-760 .bookmark .rc_3{background:url(http://hk.l.yimg.com/hk.yimg.com/i/blog/mod-bookmark600t1c1-se.gif) no-repeat right bottom;}
.row-760 .bookmark .rc_4{background:url(http://hk.l.yimg.com/hk.yimg.com/i/blog/mod-bookmark600t1c1-ne.gif) no-repeat right top;}

.row-760 .bookmark .rc_5{padding:0 56px 0 0;}
.row-760 .bookmark .rc_6{background:#ffcfcf;padding:6px 18px 6px 0;}
.row-760 .bookmark .ctnr{}
.row-760 .bookmark .new_rc{display:none;}
.row-760 .bookmark .new_rc div{}
.row-760 .bookmark .new_rc_bd{background:#d495a0;padding:1px;}
.row-760 .bookmark .new_rc_bc{background:#fff0f1;}
.row-760 .bookmark .new_rc_ft{display:none;}
.row-760 .bookmark .new_rc_ft div{}
.row-760 .bookmark .ctnr h3{font-weight:bold;font-size:14px;padding:10px 5px;color:#666;}
.row-760 .bookmark ul{list-style:none;}
.row-760 .bookmark ul li{float:left;width:193px;height:30px;overflow:hidden;background:url(http://hk.l.yimg.com/hk.yimg.com/i/blog/mod-ico-li-1.gif) no-repeat 2px 5px;padding:0 0 5px 13px;margin:3px 12px 3px 3px;font-size:12px;*font-size:11px;}

.row-760 .bookmark ul li a,.row-760 .bookmark ul li a:hover{color:#60177e;}

.row-920 .bookmark{width:920px;text-align:left;}
.row-920 .bookmark .rc_1{background:url(http://hk.l.yimg.com/hk.yimg.com/i/blog/mod-bookmark600t1c1-sw.gif) no-repeat 0 bottom;}
.row-920 .bookmark .rc_2{background:url(http://hk.l.yimg.com/hk.yimg.com/i/blog/mod-bookmark600t1c1-nw.gif) no-repeat 0 0;padding:0 0 0 15px;}
.row-920 .bookmark .rc_3{background:url(http://hk.l.yimg.com/hk.yimg.com/i/blog/mod-bookmark600t1c1-se.gif) no-repeat right bottom;}
.row-920 .bookmark .rc_4{background:url(http://hk.l.yimg.com/hk.yimg.com/i/blog/mod-bookmark600t1c1-ne.gif) no-repeat right top;}

.row-920 .bookmark .rc_5{padding:0 56px 0 0;}
.row-920 .bookmark .rc_6{background:#ffcfcf;padding:6px 18px 6px 0;}
.row-920 .bookmark .ctnr{}
.row-920 .bookmark .new_rc{display:none;}
.row-920 .bookmark .new_rc div{}
.row-920 .bookmark .new_rc_bd{background:#d495a0;padding:1px;}
.row-920 .bookmark .new_rc_bc{background:#fff0f1;}
.row-920 .bookmark .new_rc_ft{display:none;}
.row-920 .bookmark .new_rc_ft div{}
.row-920 .bookmark .ctnr h3{font-weight:bold;font-size:14px;padding:10px 5px;color:#666;}
.row-920 .bookmark ul{list-style:none;}
.row-920 .bookmark ul li{float:left;width:250px;height:35px;overflow:hidden;background:url(http://hk.l.yimg.com/hk.yimg.com/i/blog/mod-ico-li-1.gif) no-repeat 2px 5px;padding:0 0 5px 13px;margin:3px 8px 3px 3px;font-size:12px;*font-size:11px;}

.row-920 .bookmark ul li a,.row-920 .bookmark ul li a:hover{color:#60177e;}
.col-600 .bookmark ul:after,.row-760 .bookmark ul:after,.row-920 .bookmark ul:after{content:".";display:block;height:0;clear:both;visibility:hidden}
.col-600 .bookmark ul,.row-760 .bookmark ul,.row-920 .bookmark ul{zoom:1} /* ie */

/* 2007-6-14 */

/*-------- Blog Title CSS --------*/
.mod-no-rc .rc,
.mod-no-rc .rc_ft{display:none;}
.mod-no-rc .rc_bd,
.mod-no-rc .rc_bc{background:none !important;padding:0 !important;}

#blog_title .rc_bc .bd{
color:;
background-color:;
background-image:url();

}/*-------- Article Listing CSS --------*/

/* C */

.mod-alist-summary,
.mod-alist-brief,
.mod-alist-full{filter:alpha(opacity=100);-moz-opacity:1;}