香港新浪網 MySinaBlog
« 上一篇 | 下一篇 »
MySinaBlog | 1st Apr 2006 | CSS教學 | (28789 Reads)
這篇文章將會教大家如何修改網誌背景

前言:修改CSS,要具有一定的CSS的基本理解。新手可以參考W3 School的教學,這是一套十分清楚易明的教學,故我們不作重覆介紹。

不過,學習是總需要時間的,而且大家可能只是為了改一兩個小效果,要去學懂CSS,不太有效率吧﹗emoticon

為使大家可以第一時感受改變CSS帶來的效果,所以以後我們每篇教學也會定下一些目標,只要依據提供的步驟來做,即使對CSS一竅不通的也可以嘗試即時改變網誌的風格﹗emoticon

癈話少說﹗現在立即開始更改CSS﹗


第一步:了解CSS的運作

  • 首先,開啟這個測試用的CSS檔
  • 按照教學2的指示,把這個CSS檔的內容複製到你的CSS設定裡,並加以開啟
  • 現在打開你的網誌﹐應該見到外觀已經成功轉變了。emoticon
  • 所以你應該明白,網誌的外觀是可以藉著套用不同的CSS去改變的。

第二步:了解MySinaBlog CSS的基本結構

  • 測試CSS檔中,你應該看見body, #document, #header, #footer等等的標示。而在這些標示內,又會看到如background-color, font-size等等的設定。沒錯﹗就全是這些控制了你網誌的外觀。
  • 不過,如何知道我要更改的部份,是要改動相應的CSS的哪一個部份呢?
  • 答案:可以參考這個圖表,再從CSS檔中找回相應的部份,再更改就可以了。

明白了沒有?又或者你現在還是看得一頭霧水emoticon‥不要緊,現時最重要就是你已懂得如何開啟自訂CSS功能就可以了(即第一步),在稍後的日子,只要你根據我們一步步的指導,成為CSS高手也不是難事呢﹗

 

目標1:更改網誌背景

CSS檔中,找到 ‥

body{
margin    : 0px;
padding       : 0px;
text-align    : left;
background-color : #ffffff;
}

i. 更改背景顏色:把background-color : #ffffff; 改為你想要的顏色。如:background-color: #ff0000; (紅色)。如果不知道所選的顏色代碼,可以使用CSS設定裡的調色盤

ii. 更改背景圖像:如果你覺得顏色太過單調的話,你也可以使用圖像。首先,利用上載相片/檔案 ,把圖像先上傳到 MySinaBlog。然後把background-color改為background-image

body{
margin    : 0px;
padding       : 0px;
text-align    : left;
background-image: url(http://csstyle.mysinablog.com/resserver.php?resource=132274-demo2.jpg);

}

試一試,背景已經改變了﹗不難吧﹗emoticon

background 還有數種玩法,例如設定固定圖像位置、水平自動擴展等等。詳情可以參考這裡

 

這次說到這裡吧﹗

Picture

 

註:關於這篇文章的內容上的問題,請留言發問。

至於其他的CSS問題,可在這裡問。

 


[24]

我也做不到
可以麻煩你幫幫忙看看嗎?

http://foreverone_109.mysinablog.com/


[引用] | 作者 夢囈 | 31st Aug 2007 | [舉報垃圾留言]

[23] sucessfully fixed!!

我終於fixe到個bg喇^0^
原來除左要係css度改~
仲要先delete左之前進階設定既圖~記住要「更新」左先好再做其他野呀~
講多次:一delete完就「更新」


[引用] | 作者 | 21st Jun 2007 | [舉報垃圾留言]

[22]

我都跟足了以上既方法,,但係點解仲會咁架..?
http://happiness_w.mysinablog.com/
plx..幫我睇睇...


[引用] | 作者 君君 | 7th Apr 2007 | [舉報垃圾留言]

[21]

我想問下點可以令個blog的背景不停以同一畫面出現呢?而不是不停repart同一張圖,在網上尋找了很久的教學,可惜都沒教,丙來請教大大的語法(css)
就好似這個blog的背景:http://blog.qooza.hk/jelly77k2000
雖然唔係sina的,但我想可以做到這效果。


[引用] | 作者 | 7th Apr 2007 | [舉報垃圾留言]

[20] Re: 整背景的問題

我都整唔到我上載了的圖做背景/HEADER??請問應該點做呢??我試過係BODY/HEADER到打background-image:url
(http://salalaqoo.mysinablog.com/resserver.php?resource=502396-NEW.JPG);
}
但那張圖仍無法顯示在背景/header,怎麼辦?我是新手,請幫幫忙~thanks!


[引用] | 作者 CO | 7th Feb 2007 | [舉報垃圾留言]

[19]

我想成個blog都係同background一樣~ 即係話而家我個background係綠色波點... 咁文章底色係白色... 點樣整先至可以將白色變埋綠色波點呢?


[引用] | 作者 ca妹 | 4th Jan 2007 | [舉報垃圾留言]

[18]

原來有咁多人都fix唔到個bg呢........

我個圖show到出黎, 但係就不停repeat地show出來....

我有跟過aeneas 果個方法去set, 但係都唔得呢....

麻煩admin教教...


[引用] | 作者 yasuno | 29th Dec 2006 | [舉報垃圾留言]

[17] 5得

it doesn't work, HELP!! the background won't show up, why?


[引用] | 作者 GG | 28th Nov 2006 | [舉報垃圾留言]

[16]

我的背景fixed不到,不知道是不是低圖的大小問題
原先的低圖是1024 x 768,是wallpaper
我試個用photo impact把大小更改,但仍是fixed不到
我已經完全跟足格式了,可以幫我看一下嗎?
http://stecarlud.mysinablog.com


[引用] | 作者 stecarlud | 21st Nov 2006 | [舉報垃圾留言]

[15] help!!!我整唔到...>.

我跟足以上既方法, 但都係整唔到全個版面為我想要既image, 怎辦?


[引用] | 作者 以皚 | 5th Sep 2006 | [舉報垃圾留言]

Next