前言:修改CSS,要具有一定的CSS的基本理解。新手可以參考W3 School的教學,這是一套十分清楚易明的教學,故我們不作重覆介紹。
不過,學習是總需要時間的,而且大家可能只是為了改一兩個小效果,要去學懂CSS,不太有效率吧﹗
為使大家可以第一時感受改變CSS帶來的效果,所以以後我們每篇教學也會定下一些目標,只要依據提供的步驟來做,即使對CSS一竅不通的也可以嘗試即時改變網誌的風格﹗
癈話少說﹗現在立即開始更改CSS﹗
第一步:了解CSS的運作
- 首先,開啟這個測試用的CSS檔
- 按照教學2的指示,把這個CSS檔的內容複製到你的CSS設定裡,並加以開啟。
- 現在打開你的網誌﹐應該見到外觀已經成功轉變了。

- 所以你應該明白,網誌的外觀是可以藉著套用不同的CSS去改變的。
第二步:了解MySinaBlog CSS的基本結構
- 在測試CSS檔中,你應該看見body, #document, #header, #footer等等的標示。而在這些標示內,又會看到如background-color, font-size等等的設定。沒錯﹗就全是這些控制了你網誌的外觀。
- 不過,如何知道我要更改的部份,是要改動相應的CSS的哪一個部份呢?
- 答案:可以參考這個圖表,再從CSS檔中找回相應的部份,再更改就可以了。
明白了沒有?又或者你現在還是看得一頭霧水
‥不要緊,現時最重要就是你已懂得如何開啟自訂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);
}
試一試,背景已經改變了﹗不難吧﹗
background 還有數種玩法,例如設定固定圖像位置、水平自動擴展等等。詳情可以參考這裡
這次說到這裡吧﹗
註:關於這篇文章的內容上的問題,請留言發問。
至於其他的CSS問題,可在這裡問。

