又有css語法---個人欄highlight,footer之美化(15/11/2009 修圖完成)

又有css語法---個人欄highlight,footer之美化

近日我在格友 To的網誌內學懂了更多的 css設置,令到我Blog看起來更加漂亮,

我現在把自己所學到的跟各位分享,農曆年假快來,

趁多天假期可以慢慢整靚個Blog.

To 的教學有2篇,分別是: 圖片做名小修改 及 個人頭像小修改 

但我並沒全部照跟所有,因為我要配合自己Blog的風格,

各位可以前往他的格觀看.

我今次的改變是:

1. 頭像 

首先我要把Yahoo Blog本身預設的jpg格式圖片隱身

語法:

#profile_img_highlight-full{height:0px;}

 (按下頭像看如何制圖)

語法:

#profile_img_highlight{BACKGROUND:url(圖link) no-repeat center;height:XXXpx;}

各位要緊記,使用了這組語法後,原本巳set好的個人jpg大頭相不要走去删,

因為刪掉美感欠奉囉.

2. 把預設的 rose 名字隱身.用圖替代原本的預設.

隱身後便不能由這裏按下前往觀看個人資料,但最要緊是漂亮嘛.

語法:

#profile_highlight .nickname a{color:ffffff;font-size:0%;}

 (按下Rose看如何制圖)

語法:

#profile_highlight .nickname{background:transparent url(圖link) no-repeat center;height:XXpx;}

3. 加入  一幅圖片作為裝飾

這個可加可不加,反正素材這麼多,我找來一幅圖片加入

語法:

#profile_highlight .zodiac{background:transparent url(圖link) no-repeat center;height:XXpx;}

4. Blog底footer加入圖片作裝飾

首先把Yahoo Blog本身預設的 border line 隱身,及找一張美美的圖放入.

語法:

#footer{border-width:0px;}
#footer .provider p, #footer .info p, #footer .rights p, #footer .privacy p, #footer .disclaimer p, #footer .provider h4{font-size:0px;}
#footer{font-size:0px;}

#footer{background:transparent url(圖link) repeat;}

5. 個人欄highlight 背景透視 (14/04/2009 更新)

#profile_highlight .bd{background:transparent;}

Rose 碎碎念:

預制好的gif圖片可上傳至(按下看教學),

取得url link 的圖址,套入css語法內,

 Yahoo Blog 基本設置只是接受 jpg,

所以 gif 的圖便要上傳去網络空間保存及運用在語法中.