close
網誌最上面,就是招牌(也有人叫作「橫幅」)

下一張(熱鍵:c)

招牌就是 #banner


 招牌的大小和顏色


怎麼改變招牌的樣子呢?在樣式表最下方,加入這一句:

#banner {
background: #FFFF00; /*招牌顏色
*/
width: 800px;
/*寬度*/
height: 150px; /*高度*/}
紅色的數值
可以自己決定,請利用 色碼表

改變之後就像這樣~

回上一層(熱鍵:b)



 網誌名稱


網誌名稱就是
#pageheader h1 a

在樣式表最下方,加入這一段:


#pageheader h1 a {
font-size: 60px;
/*網誌名稱的大小*/
color: #AA0000; /*網誌名稱的顏色*/}
#pageheader h1 a:hover {
color: #FFFFFF; /*網誌名稱,滑鼠移上去時的顏色
*/}

就可以做出變化啦~

回上一層(熱鍵:b)

你也可以移動一下「網誌名稱」:

#pageheader h1 {text-align: right; /*
網誌名稱靠右邊*/}
#pageheader h1 {text-align: center; /*網誌名稱靠中間*/}
#pageheader h1 {text-align: left; /*網誌名稱靠左邊*/}


 網誌描述


網誌描述就是 .description
在樣式表最下方,加入這一段:

.description {
top: 160px; /*網誌描述跟上方的距離
*/
left: 80px;
/*網誌描述跟左邊的距離*/
font-size: 30px; /*網誌描述的大小*/
color: #660077; /*網誌描述的顏色*/}

就可以做變化~




 怎麼用自己的圖片當招牌


先把圖片上傳到相簿,取得圖片網址,然後在樣式表加入:

#banner {background:url(圖片網址) no-repeat center top;}

就像這樣,
掛上了自己做的圖片

下一張(熱鍵:c)

不過,網誌名稱會跟圖片打架,我們把它隱藏起來:

#pageheader h1 a { visibility: hidden;}


就像這樣~
如果用「GIF閃圖」當招牌,應該也滿酷的…

回上一層(熱鍵:b)


今天就教到這裡,下課!




這堂課的重點

‧招牌就是 #banner
網誌名稱就是 #pageheader h1 a
網誌描述就是 .description
用自己的圖片當招牌
arrow
arrow
    全站熱搜
    創作者介紹
    創作者 jennamay30 的頭像
    jennamay30

    小咘

    jennamay30 發表在 痞客邦 留言(0) 人氣()