April 13,2005

樣式summer的修改

因為很喜歡[ 時光。記事本 ]這個部落格的風格,所以在修改站內現成的樣式時,決定選擇summer來做修改。

參閱了think of joe的樂多Blog更換banner最速法,創造更具個人特色的Blog!之後,初步修改了summer的三項樣式:
1.banner圖片
2.sidetitle
3.calendarweek

其詳細設定值如下:
1.#banner
{ BACKGROUND: url(http://blog.roodo.com/yoren/f673ee0b.jpg) no-repeat 50% 0px;
WIDTH: 740px;
HEIGHT: 100px
}
2..sidetitle
{ PADDING-RIGHT: 5px; PADDING-LEFT: 5px; FONT-WEIGHT: bold; FONT-SIZE: 11px; BACKGROUND: #7f8eb7; PADDING-BOTTOM: 3px; COLOR: #fff; PADDING-TOP: 3px; LETTER-SPACING: 2px; TEXT-ALIGN: left
}
3..calendarweek
{ FONT-WEIGHT: bold; FONT-SIZE: 11px; COLOR: #fff
}

此外,為了使說明更為容易閱讀,又增加了樣式:
.em {
COLOR:red;
}


因此,可以為上面樣式詳細設定值加上重點提示:
1.#banner
{ BACKGROUND: url(http://blog.roodo.com/yoren/f673ee0b.jpg) no-repeat 50% 0px;
WIDTH: 740px;
HEIGHT: 100px
}
2..sidetitle
{ PADDING-RIGHT: 5px; PADDING-LEFT: 5px; FONT-WEIGHT: bold; FONT-SIZE: 11px; BACKGROUND: #7f8eb7; PADDING-BOTTOM: 3px; COLOR: #fff; PADDING-TOP: 3px; LETTER-SPACING: 2px; TEXT-ALIGN: left
}
3..calendarweek
{ FONT-WEIGHT: bold; FONT-SIZE: 11px; COLOR: #fff
}
紅色字體為修改過的部分。

Posted by yoren at 樂多Roodo! │01:13 │回應(4)引用(0)站內裝潢
樂多分類:日記/一般 工具:編輯本文
Ads by Roodo! 

引用URL

http://cgi.blog.roodo.com/trackback/72701
回應文章
當然,banner的圖片是事先準備好的,我將自己拍攝的照片以photoshop剪裁出734*100px的大小,然後上傳到樂多。
所以圖片實際的寬度只有734px,和設定裡的740px有點差距,但是很小,視覺上不太明顯。理論上圖片和語法的數值應該要設定相等才對。
Posted by yoren at April 14,2005 00:55
Yoren 你好:

可不可以請教一下,我也將我的banner高度改短了,可是要如何縮短banner和內文的距離?

謝謝你,也祝你開心!
Posted by Stephen at July 6,2005 04:27
hi Stephen:

試試看把#banner裡面的HEIGHT改為100px,
我用Firefox去修改你網站的CSS,看過以後是可以的(如圖)。
Good Luck!
Posted by yoren at July 6,2005 08:28

Hi Yoren:

謝謝你的說明。已經可以了。

Have a nice day!!!
Posted by Stephen at July 6,2005 17:42