2004/12/23

為文章標題加上美美的背景吧!

新浪部落格的預設「文章標題」, 雖然使用較大字體,不同顏色,總覺得單調了些。 小老鼠就作了小小修改,讓文章標題有淡淡的美麗花紋。 一起來作作看吧!


文章標題設定的位置,在以下這個位置:

.title {/* title:blog title */ font-family:新細明體;/* W3 */ text-align: left;/* W3 */ font-size: 1.25em;/* W3 */ font-weight:bold;/* W3 */ font-style:normal;/* W3 */ font-height:180%; color: #F7941D;/* W3 */ border:0px solid red;/* W3 */ background-position:auto; /* 背景圖的位置:自動 */ background-repeat:repeat-x; /* 背景圖 x 軸(横向)重覆顯示 */ background-image: url("http://blog.sina.com.tw/myimages/xxx/xxx/images/你的背景圖.gif"); /* 背景圖的超連結 */ padding-bottom:5px; /* 背景圖邊界與字底距離,向下延伸 5 相素 */ padding-top:5px /* 背景圖邊界與字頂距離,向上延伸 5 相素 */ }
咖啡字的那些行,是小老鼠自己加上去的。 --同樣地,你也可以直接 copy 回去修改。 其中,background-repeat:... 這行可以不寫。 圖片預設為「左右前後無限重覆延伸」。 如果你的圖片只想要向延伸,就設定 repeat-x; 。 同樣的,只想要向延伸 (這在「部落的大背景圖」設定上,十分好用哦!),               就設定 repeat-y; 。 所謂「背景圖距離」,是相對於文字大小而言。 除了 padding-top(圖邊界距離字頂),padding-bottom(圖邊界距離字底), 當然也可以設定 padding-left(圖邊界距離字左邊),padidng-right(圖邊界距離字右邊)。

學會這招,相信你也可以創造出自己獨特的文章標題喔!


關鍵字: 部落 顏色 文章