非學不可

【部落格css樣式】痞客樣式簡易修改(1) 如何改橫幅

//系列文章//

【部落格css痞客樣式教學】痞客樣式簡易修改(1) 如何改橫幅

【部落格css痞客樣式教學】痞客樣式簡易修改(2) 如何設定橫幅上部落格主副標題的顏色

一開始要直接從無到有設計出一個版型對初學者來說的確有難度，

但是只要透過套用別人設計好的版型直接修改就可以達到完全不同的風格，

尤其網頁的橫幅主插圖，是最能展現一個網頁風格的強調重點，

所以接下來要介紹如何從css中修改部落格的橫幅，而且改得天衣無縫唷!

<<原本套用版型的原貌>>

#header{

background:url(http://pic.pimg.tw/bianca1206/1198469729.jpg);

height:200px;

padding:10px;

margin-bottom:10px;

}

首先找到#header這個橫幅的區塊

background:url(http://pic.pimg.tw/bianca1206/1198469729.jpg);

來看看套用的這個版型background的圖片的尺寸

把網址貼到瀏覽器網址列打開圖片，在上面就可以看到這張圖是950*251像素(或在圖片上點右鍵打開屬性查看)

接著就是找一張你想要當橫幅的圖片換上去就可以了。

最快速最直接的方法就是把圖做成950*251像素大小放上去，就不會有位置不正確移位之類的情形。

當然要在網路要找到跟自己需要的尺寸圖片是很難的，這一篇先假設大家都會改圖片尺寸囉，

下一篇在來寫簡易的製圖教學。

換掉background的圖片網址就變成新的橫幅囉

#header{

background:url(http://www.oz.stu.edu.tw/s96108201/www/234.jpg);

height:200px;

padding:10px;

margin-bottom:10px;

}

ps：css樣式的規則是適用各個部落格喔!雖然是用痞客做為示範，但無名、天空等各家部落格都是一樣的^^