:: Mr. 戀上 Miss. ::

→

首先，若是新加入blog 的成員
我會建議你們先到唐朝的初學者的入門使用說明書看看

接下來
我此篇日記主要是針對修改blog CSS的網頁樣式為主

何謂〝CSS 網頁樣式〞？

我想一定有人會想要修改標題字體的大小、左or右兩邊連結區的字體顏色、或是像我一樣自行修改背景的圖檔……之類的吧

這些，都必須動用到〝CSS 網頁樣式〞

我不敢說自己是非常厲害啦 ^^"
只能說，我這篇日記或許能幫助你更快進入狀況

首先，要進入哪裡修改〝CSS 網頁樣式〞呢？
一定要先登入，接著照著下圖的步驟一一選擇↓


一定會先看到網頁樣式設定(先點選)
接著再點選個人化設定
( 在選個人化設定之前，你應該有一個樂多已經設定好的CSS版面了，選一個你覺得比較好改的版面下去做更改 )

此篇文章我是以newspaper的版面作解說

大部份都大同小異
只要摸熟了，自然就比較好上手
我也只能把我了解的CSS打上來
對於沒有解說到的部份，我也正在研究中 ^^"

若你已經點選進個人化設定了
你應該會看到下圖的畫面↓


BODY↓
COLOR：#999999
邊欄區，迴響後面的名字顏色，如〝Girl`s 留言板 (xx)〞
如圖：


background-color：#FFFFFF 版面最左右兩邊長條的背景色
如圖：


#container
TEXT-ALIGN: left;
這個位置是在更改文章及回應內容的位置
如果改成〝center〞那麼所有的字就會置中
想置於哪一個位置，那就看你們自己囉 ^_^

.description
TEXT-ALIGN: left;
這個是在改〝說明區〞字串的位置
也就是首頁標題下面各位打上的字串

#content
FLOAT: left;
這個是在改邊欄位置的語法
如果你發現你的邊欄會往下跑
通常有兩種可能性：
1、放在邊欄的圖檔太大，或是文章圖檔的關係，導致走位
2、CSS 的設定出了問題

我不清楚各位的問題
不過這個是我剛剛隨便亂改改出來的 ^^"
既然講到這裡，附帶一下
假如有些版面你很喜歡，可是可能邊欄的位置你不喜歡
大部份都可以用以下的方法做更改 ( 改不過來我也沒辦法 ^^" )
1、找到〝#content〞把〝Float: xx〞改為〝Float: aa〞
2、接著找〝#links〞把〝Float: xx〞改為〝Float: aa〞

我會用〝xx、aa〞代替是因為每個版型的位置都不一樣
我不清楚你是想〝左→右〞還是〝右→左〞
所以只好麻煩你們自己判斷囉 ^^"

A.acontinues (acontinues、acontinues：link、acontinues：visited、acontinues：hover)↓
所有〝COLOR：#999999〞都是在改〝繼續閱讀〞的字體顏色
有些版面的〝acontinues：visited〞的部份後面沒有出現
〝COLOR：#999999〞請自行加入
否則的話，改出來的顏色，只有滑鼠移過才會顯示你想要的顏色
若是想直接看到顏色的變化，就必須在〝acontinues：visited〞後面加入顏色的語法
如圖：


A.amenu (amenu、amenu：link、amenu：visited、amenu：hover)↓
方法同〝A.acontinues〞
這裡是在改每一篇日記結束的右下方會有
〝回blog 首頁 上一篇〞的字體顏色
如圖：


#banner A (#banner A、#banner A：link、#banner A：visited、#banner A：hover)↓
所有的〝COLOR：#4E4E4C〞都是在改首頁標題的字體顏色
如圖：


.blogtitle↓
裡面的〝FONT-SIZE：13px〞是在改標題的字體大小 (如上圖)

.date↓
COLOR：#FFFFFF
首頁每一篇日記標題上面的日期顏色，如〝March 28, 2005〞
background-color：#4E4E4C
若是日期底下有橫條標明的話，這個就是改橫條的顏色
若是沒有橫條，想增加橫條，只要加入這句語法就會出現橫條了
如圖：


.title↓
background-image：(http://blog.roodo.com/theme/news2/title.gif)
這個是每一篇日記題目前面可放置的圖案
有些版面已經有這個語法了，可以自行更改圖片；若是沒有這個語法
也可以自行加入 ( 把紅色網址換成你要的圖 )
如圖：


PADDING-LEFT: 35px若是圖檔較長 or 較大，會與日記標題重疊
這個時候只要把紅字部份的數字改大一點就行了

p.s.
如果你選定的樂多版面，日記標題前面本來就沒有圖
那麼你必須自行在〝.title〞那段語法最後加上下面這段語法↓
如果沒有加上去，那麼就算你貼了圖，還是會無法顯示出來唷

除了增加上述我所寫的，還有一個部份要修改↓
padding-left: 25px;若是本來就是沒有圖的版面
紅字部份應該是顯示〝top 〞才是，記得要修改成〝left 哦

.main↓
COLOR：#333333 這個是改所有日記內容的字體顏色語法

.posted↓
COLOR：#4E4E4C 日記寫完，最下面會出現一排〝Posted by happy1211230 at Roodo! │16:12 │回應(10) │好書介紹〞
這個是在改沒有連結部份的字體顏色
如：〝Posted by happy1211230 at〞
如圖：


border-bottom-color：#CCCCCC
若每一篇日記的區分是分隔線，這個是分隔線的顏色

如果想把每篇文章最下方的
〝Posted by ferrari701230 at Roodo! │01:14 │回應(0) 〞
像我這樣框起來，如下圖↓

只要在〝.posted〞最下方加入下列語法即可↓

A.aposted (A.aposted、A.aposted：link、A.aposted：visited、A.aposted：hover)↓
所有的〝COLOR：#9999999〞則是改〝.posted〞後半部連結的字體顏色，如〝Roodo! │16:12 │回應(10) │好書介紹〞

待續… …