【部落格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樣式的規則是適用各個部落格喔!雖然是用痞客做為示範，但無名、天空等各家部落格都是一樣的^^
【非氏不可】各班講義/開班資訊/行銷托管服務 (6)
謝謝教學，正是適合我這種初學者，希望可以快點改好橫幅。 到時候再麻煩Sophie來驗收一下哦 XD 版主回覆：(01/21/2010 04:04:04 PM) 我有去看你的部落格唷...你畫的圖很可愛耶 期待看見你的橫幅唷^0^
請教一下：我把圖片調成900*360了，但是上傳之後卻變成 600*240 ，不知道是什麼原因呢？我試好久，3點了 QQ 版主回覆：(01/21/2010 04:02:34 PM) 你是傳到痞客相簿嗎，如果是的話到相簿的後台，"進階/基本設定"裡的"上傳與縮圖設定"把""上傳時保留原始尺寸相片"這欄選"是"。 這樣上傳圖片後，在相簿裡大張的圖他就會在圖的右下角有一個"看原始圖"的鈕。 點下去看原始圖就沒有縮圖了唷^^
終於完成了 @@ 再來是側邊欄了，如果遇到問題再麻煩Sophie幫我解答囉，感恩！ 版主回覆：(01/22/2010 03:00:05 AM) okok~有什問題多來這裡看看唷
雖然CSS碼是看的懂 也會自己改 但是...本身就沒美感 怎麼改都不好看啊XD 所以還是放棄動了 版主回覆：(01/22/2010 03:25:21 AM) 先設計好版型看是要畫在紙上還是電腦上 應該會比較好看些0.0呵呵...
等過陣子我的格子內容有增加時再來設計自己的,感謝你的教學分享,到時可能還有問題可能需要您的幫忙,謝謝囉 版主回覆：(01/26/2010 01:34:20 PM) 歡迎互相交流討論。 css是死的，但設計卻是靈活的。 許多精緻美觀的版面，常常只是設計者一個巧思，令人讚嘆不已。。
不過要真的花很多心思就是了
謝謝你的教學，非常的受用~ 已經改好橫幅了，有點怪怪的~ 不過，這樣對我這個初學者而言已經很滿足了啦~ ^^
搜尋了很多教學，只有你的淺顯易懂，謝謝^^~ 版主回覆：(02/03/2010 09:18:58 AM) 謝謝你，若有不懂再問喔︿︿
我是新手勒...好不容易自己用軟體設計好橫幅..但我想要900*350 但還是會裁掉下面...要如何才會整個出來....也請大師幫我看一下喔 版主回覆：(08/26/2010 02:03:31 PM) 這不是圖的問題。 你要去改橫幅區塊的長跟高。 把高度拉高，就會顯示了。
今天是母親節，先祝你母親節快樂