求助 | 註冊 | 登入
修改網誌基本樣式
by m97332004, 2010-03-13 16:48:58, 人氣(2380)
 
說明:
 
1. 建議使用Windows XP Professional sp3 Internet Explorer 7.0 來進行各項操作
 
 
步驟:
 
1. 點選「管理」→「編輯樣式」
編輯樣式

2. 網誌版面樣式

  (1) 版面各部分的名稱
       版面各部分名稱
 
  (2) 樣式編輯畫面(css)
           css畫面
        

 
 
3. 網誌版面樣式設定:整體 (本教學範例供參考,以 /* ... */ 標註者為說明文字)
版面整體設定

  (1) 網誌字體字型(font-family) :預設為Arial,共有三個樣式(verdana, arial, impact)可供選擇

  (2) 網誌字體大小(font-size):

     font-size: 12px;  /* 將字體大小設成12 */

  (3) 網誌字體顏色(color):

     color: #555;  /*顏色為#555 ; 色碼所代表的顏色請參考色碼表*/

  (4) 網誌位置(text-align):

     text-align:center;  /* 網誌位置設定置中,left為置左,right為置右 */

  (5) 網誌背景圖片或顏色(background):

     background:#000000;  /* 將背景設成黑色, 色碼所代表的顏色請參考色碼表 */  
     background:url(圖片網址);  /* 將圖片網址設成背景 */
 
 
4. 網誌版面樣式設定:超連結樣式 (本教學範例供參考,以 /* ... */ 標註者為說明文字)
版面超連結設定

  (1) 未點選過的超連結(a:link) :

     color:#66f;  /* 顏色為#66f */
     text-decoration:none  /* 字體無變化 */

  (2) 已點選過的超連結(a:visited) :

     color:#66f;  /* 顏色變為#66f */     text-decoration:none  /* 字體無變化 */

  (3) 滑鼠移到超連結上(a:hover) :

     color:#f00;  /* 顏色變為#66f */
     background:#f7efde  /* 背景顏色變化為#f7efde */

  (4) 執行中的超連結(a:active) :

     color:#f00;  /* 顏色變為#66f */
     background:#f7efde  /* 背景顏色變化為#f7efde */
 

5. 網誌版面樣式設定:標題樣式 (本教學範例供參考,以 /* ... */ 標註者為說明文字)

  (1) 標題設定(#banner):       
       標題設定
     width: 1000px; height: 293px;  /* 標題大小, 寬1000px; 高293px*/
     background:#000000;  /* 標題顏色設為#000000*/
     background:url(http://xxx.xxx.xx/000.png);  /* 標題放置圖片, 括弧為圖片位址*/  (與顏色擇一設定)
 
  (2) 標題文字(#banner .title):
      設定標題文字
 
     left:100px; top:10px;  /* 標題logo向左平移100px, 向上平移10px */
     font-family: Arial;  /* 字體設為Arial */
     font-size: 15px;  /* 字體大小為15px */
     color: #FF0000;   /* 字體顏色設為#FF0000 */