改 變 部 落 格 文 字 大 小



分類:*語法檔*

2007/01/12 23:14


  單篇文章的文字放大

  語法



字放在這裡




 



1.點選發表文章


2.先打好文章內容


3.勾選左下方有一個  {觀看HTML原始碼}


4.勾選後..將語法貼進去..


 


語法說明



            貼在所有文字最上面



                     
貼在文字最下方



3>              更改數字可變換文字大小


 


  所有的文章文字都使用同樣大小


語法


/*Text color for main content*文章欄位字體顏色*/
.yc3pribd .text {color: #0066ff;font-size:150%;font-family:標楷體;}


 


語法說明


font-family:標楷體;     如果你不想更換字體~就刪掉這些字~或更改成你


想要的字體


font-size:150%;            依你自己的喜好~~更改數字~~改成自己喜歡的大小


color: #0066ff;         如果你不想更改文字顏色~就刪掉這些字~


或更改成自己喜歡的顏色_____色碼表


 


1.你的大頭貼下方 「編輯個人檔案」點進去


2. 進入「管理部落格首頁」後,點選「面板設定」的「自訂樣式」


3. 然後將你想要更改那一部份的語法貼到所有文字的最下方


4.確定


 


    語法


/*Text color for blog title*部落格標題字體顏色*/
#yblogtitle .text {color: #660099;font-family:標楷體;font-size:150%;}



/*Text color for main content*文章欄位字體顏色*/
.yc3pribd .text {color: #0066ff;font-size:150%;font-family:標楷體;}



/*Text color for module*左右欄位字體顏色*/
.text {color: #0066ff;font-size:150%;font-family:標楷體;}


 


/*Blog title*部落格標題大小顏色*/
#yblogtitle .mbd,#yblogtitle .mft{ font-family:標楷體;font-size:170%}
#yblogtitle h1{color:#FF0000;font-family:標楷體;}



/*Text color for blog title*部落格資料文字顏色*/
#yblogtitle .text {color: #FF0000;}


 


自己更改測試~~找出自己看起來最順眼的大小..顏色..字體


如果你是新手..對CSS不熟..會擔心CSS亂掉


你可以先將原來的CSS語法複製下來..貼在記事本


如果亂掉了..再貼回來就好了


 









標題文章加小圖&更改字型




2007/01/02 12:20

請將語法貼至「管理部落格」-----「面版設定」-----「自訂樣式」-----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(http://tw.yimg.com/i/tw/hp/spirit/yahoo_logo.gif) no-repeat;

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

第2行的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是所有文章和更多回應圖檔******



arrow
arrow
    全站熱搜

    彤 發表在 痞客邦 留言(1) 人氣()