ω。艾媽の手作 Mapin-cloth 小舖。ω

標題文章加小圖&更改字型
請將語法貼至「管理部落格」-----「面版設定」-----「自訂樣式」-----CSS表裡頭即可。
如CSS表裡有的話，請直接覆蓋，如沒有的把語法貼於CSS表下方就可以了。

*****基於安全考量，請把資料先行備份*****


(一)文章標題前+小圖及文章標題的字型更改及顏色變換:

例一:

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


語法解釋:

font-size:150%    >>>>>  字型的大小，數字越大字越大。
32px >>> 圖片與字體的差距。
font-family:華康娃娃體 >>>> 字體可直接打字進去更換電腦裡有的即可。
color:#195693 >>>>請使用色碼表去更換色調。

例二:

這段CSS語法, 沒有包含在yahoo原本給的css編輯框裡, 所以你只要把語法加上去即可

/*article content module*/
.yblogcnt .blgtitlebar h2 {font-size:126%;font-weight:bold;background:url(小圖網址) no-repeat;padding-left:28px;}
.yblogcnt .blgtitlebar h2 a {color:#000000; }


‧h2是指文章標題

‧font-size 是文字大小 yahoo預設的是126% , 想加大或變小 直接改數字即可 (%是相對大小)
　文字大小也能改成固定大小, 例如12px, 14px, 之類的

‧font-wight是字體粗細, 因為是文章標題, 所以我設的是粗體字 bold，如果你不想加粗,直接把那段語法刪掉即可

‧background是背景顏色或背景圖的設定指令，因為我們要在標題前面加小圖，所以要把小圖的圖檔連結設定在這邊，後面加 no-repeat 表示背景圖不重覆顯示
　設定完成後，那段語法應該長這樣：background:url( ) no-repeat;

‧padding-left:28px，指的是文字和左邊要隔多寬，數字的大小是依照圖片的寬度決定的，如果圖片寬是30px，你就要把28改成31或32，才不會文字標題去蓋到圖。

第２行的h2 a{color:#000000;} 是標題連結的顏色設定, 如果你要改標題的顏色,就從這邊改喔!

色碼表可以點到這邊參考

小圖網址 這邊有很多, 但大家不要選太大的小圖去放歐, 因為你的文字沒那麼大, 如果圖太大, 那圖只會顯示一半而以唷~ (看得懂日文的人可以到素材網去看看)

*顏色數碼表 http://home.kimo.com.tw/nkhs9323005/YY5.htm

(二)更新日期欄的標題小圖:

/*Module latest upup*/
#ymodupdate .mbd .date{background:url(圖片網址) left center no-repeat;padding-left:11px;font-size:104%;font-family:verdana;}


語法解釋:

11px >>>>  圖案與字的差距。


(三)左右欄位標題前小圖:

/*Nav module list*/
.ycntmod .mbd ul.list li {background:url(第一個圖片網址) left .1em no-repeat;padding-left:25px;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;}


語法解釋:

******1em(圖片下移數值，數字越大下移越多)******
******25px(文章標題前面圖檔和右邊文字相差距離，數字越大，兩者之間距離越遠)******
******3px;_margin-bottom:3px;_line-height:1.5em(行距高度倍數，數字越大，高度倍數越高)******
******第一個url是文章標題前面圖檔******
******第二個url是所有文章和更多回應圖檔******