DIY玩化學

範例：

↓以下是本部落格所使用的↓

/*Master header*/
#yhtw_masthead{background-image: url(http://tw.f14.yahoofs.com/myper/qZUdTTKeBRQ96YSnQrLppw--/blog/20060926015457875.jpg?TTaAGGFBoAp_44_s); background-repeat: repeat; color:#E189A2; background:#ffffff; filter:alpha(opacity=50); opacity:0.50; moz-opacity:0.5;}
#yhtw_masthead a,#yhtw_masthead a:link,#yhtw_masthead a:visited,#yhtw_masthead a:hover,#yhtw_masthead .mhuser div,#yhtw_masthead .mhuser div a, #yhtw_masthead .mhuser div b,#yhtw_masthead .masthead_function strong{color:#CC0066;}

↓以下是更改後的範例↓(複製以下的回去更改)

/*Master header*/
#yhtw_masthead{background-image: url(背景圖片); background-repeat: repeat; color:#E189A2; background:#ffffff; filter:alpha(opacity=50); opacity:0.50; moz-opacity:0.5; font-family:標楷體; padding-left:20px; font-size:130%}
#yhtw_masthead a,#yhtw_masthead a:link,#yhtw_masthead a:visited,#yhtw_masthead a:hover,#yhtw_masthead .mhuser div,#yhtw_masthead .mhuser div a, #yhtw_masthead .mhuser div b,#yhtw_masthead .masthead_function strong{color:#CC0066;}

部落格介紹的字型

範例：

↓以下是本部落格所使用的↓

/*Blog title*/
#yblogtitle .mbd,#yblogtitle .mft{background-color:#CDBAD6; color:#FDECF6;}
#yblogtitle h1{color:#0000FF; font-weight:bolder;}

↓以下是更改後的範例↓(複製以下的回去更改)

/*Blog title*/
#yblogtitle .mbd,#yblogtitle .mft{background-color:#CDBAD6; color:#FDECF6; font-family:標楷體; font-size:130%}
#yblogtitle h1{color:#0000FF; font-weight:bolder; font-family:標楷體; font-size:130%}

文章標題的字型

範例：

↓以下是本部落格所使用的↓

/*article content module*/
.yblogcnt .blgtitlebar {margin-bottom:10px;zoom:1;}
.yblogcnt .blgtitlebar h2 {font-size:126%;font-weight:bold;background:url(圖片網址) no-repeat;padding-left:32px;}
.yblogcnt .blgtitlebar h2 a {color:#195693; padding-right:5px;}

↓以下是更改後的範例↓(複製以下的回去更改)

/*article content module*/
.yblogcnt .blgtitlebar {margin-bottom:10px;zoom:1;}
.yblogcnt .blgtitlebar h2 {font-size:126%;font-weight:bold;background:url(圖片網址) no-repeat;padding-left:32px; font-family:標楷體;}
.yblogcnt .blgtitlebar h2 a {color:#195693; padding-right:5px;}

欄位標題的字型

範例：

※以下有兩種範例可使用

↓以下是本部落格所使用的↓(複製以下的回去更改)

*Nav module list*/
.ycntmod .mbd ul.list li {background:url(圖片網址) left .1em no-repeat;padding-left:17px;margin-bottom:3px;_margin-bottom:3px;_line-height:1.5em;}
.ycntmod .mbd ul.list li.more {margin:-3px 0 0 -3px;text-align:right;background:url(圖片網址) 48px center no-repeat;}
#ymodmsgbd .mhd h3,.ycntmod .mhd h3,
#ymsgboard .mhd q{font-size:13px; padding-left:45px;}.ycntmod .mhd h3,
#ymodcal .mhd .selyr{font-size:13px;}
#yarticle .mhd h3,
#ypartsingle .mhd h3,
#yphtlist .mhd h3,
#yjntlist .mhd h3,
#ymsgboard .mhd h3{font-size:12px;}

↓以下是更改後的範例↓(複製以下的回去更改)

*Nav module list*/
.ycntmod .mbd ul.list li {background:url(圖片網址) left .1em no-repeat;padding-left:17px;margin-bottom:3px;_margin-bottom:3px;_line-height:1.5em;}
.ycntmod .mbd ul.list li.more {margin:-3px 0 0 -3px;text-align:right;background:url(圖片網址) 48px center no-repeat;}
#ymodmsgbd .mhd h3,.ycntmod .mhd h3,
#ymsgboard .mhd q{font-size:13px; padding-left:45px; font-family:標楷體; }.ycntmod .mhd h3,
#ymodcal .mhd .selyr{font-size:13px;}
#yarticle .mhd h3,
#ypartsingle .mhd h3,
#yphtlist .mhd h3,
#yjntlist .mhd h3,
#ymsgboard .mhd h3{font-size:12px;}

欄位標題的字型(延伸使用~文字置中)

範例：

上方的文字﹝文章分類﹞看起來是在置中的位置
在Yahoo的部落格文字設定中
是沒有置中語法
其實是自行加入文字向右移的語法
使文字看起來是在置中的位置

↓以下是基本的語法↓

/*Nav module litle*/
#ymodmsgbd .mhd h3,.ycntmod .mhd h3,
#ymsgboard .mhd q{font-size:13px;}.ycntmod .mhd h3,
#ymodcal .mhd .selyr{font-size:12px;}
#yarticle .mhd h3,
#ypartsingle .mhd h3,
#yphtlist .mhd h3,
#yjntlist .mhd h3,
#ymsgboard .mhd h3{font-size:12px(數字越大字體越大);}
　

引用：http://tw.myblog.yahoo.com/jw!qZUdTTKeBRQ96YSnQrLppw--/article?mid=47