[更改Blog界面的方法] 讓你的Blog更個性化些

這幾天在CSDN的Blog上看了好些人的文章！也收獲或多或少！^o^
不過在Blog上的界面看來看去都是這么傳統的幾個好看點。于是就突發奇想，看看可不可以把自己的Blog改得更好看更有自己的個性化點！呵！現在這個界面，就是結果了！

下面我把代碼貼出來，也讓大家的Blog更個性化些吧！代碼很簡單，也只是一些HTML加上一點點Javascript罷了！最重要的就是要了解下CSS樣式表了！

_________________________________

首先進入你的Blog管理中心，選擇：選項->配置
在“定制CSS選擇器”文本框中輸入你自己定義的CSS樣式表。（下面是我的界面的CSS代碼）：

---------------------------------------------------------------------------------

body{
background-color: #666666;
margin: 0px;
padding: 0px;
SCROLLBAR-FACE-COLOR: #FFFFFF;
SCROLLBAR-HIGHLIGHT-COLOR: #888888;
SCROLLBAR-SHADOW-COLOR: #888888;
SCROLLBAR-3DLIGHT-COLOR:#FFFFFF;
SCROLLBAR-ARROW-COLOR: #888888;
SCROLLBAR-TRACK-COLOR: #FFFFFF;
SCROLLBAR-DARKSHADOW-COLOR:#FFFFFF;
}
.headermaintitle {
font-size: x-large;
FILTER: dropshadow(color=#000000, offx=1, offy=1, positive=1); WIDTH: 100%;
}
.midd {
vertical-align: middle;
}
.FooterCell {
visibility: hidden;
}
#top {
BACKGROUND-POSITION: right top;
BACKGROUND-IMAGE: url(http://www.so26.com/Images/bg_1.gif);
BACKGROUND-REPEAT: no-repeat;
HEIGHT: 88px
VERTICAL-ALIGN: middle; HEIGHT: 75px; BACKGROUND-COLOR: #BB3D00;
}
.post {
background-color: #F7F7F7;
BORDER-RIGHT: #cccccc 1px solid;
PADDING-RIGHT: 15px;
BACKGROUND-POSITION: 50% top;
BORDER-TOP: #cccccc 1px solid;
PADDING-LEFT: 15px;
FONT-SIZE: 9pt;
MARGIN-BOTTOM: 28px;
PADDING-BOTTOM: 15px;
BORDER-LEFT: #cccccc 1px solid;
COLOR: #000000;
LINE-HEIGHT: 22px;
PADDING-TOP: 1px;
BORDER-BOTTOM: #cccccc 1px solid;
BACKGROUND-REPEAT: repeat-x;
background-image: url(http://www.so26.com/Images/bg_2.gif);
}
a:link {
color: #000000;
text-decoration: none;
}
a:visited {
color: #000000;
text-decoration: none;
}
a:hover {
color: #000000;
text-decoration: underline;
}
.post H2 {
FILTER: dropshadow(color=#FFFFFF, offx=1, offy=1, positive=1); WIDTH: 100%;
}
.post .postfoot {
color: #FF6600;
}
H5 {
FILTER: dropshadow(color=#FFFFFF, offx=1, offy=1, positive=1); WIDTH: 100%;
}

---------------------------------------------------------------------------------

然后在“靜態新聞/聲明”的文本框中輸入HTML或Javascript代碼。（下面是我的界面的代碼）：

---------------------------------------------------------------------------------

<bgsound src="http://www.so26.com/mid/Loop_1.mid"/>
<DIV id=Layer2 style="BORDER-RIGHT: #000000 0px; BORDER-TOP: #000000 0px; Z-INDEX: 0; LEFT: 0px; BORDER-LEFT: #000000 0px; WIDTH: 180px; BORDER-BOTTOM: #000000 0px; POSITION: absolute; TOP: 0px; HEIGHT: 120px; BACKGROUND-COLOR: #eeeeee; layer-background-color: #eeeeee">
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="180" height="22" align="left" valign="middle"><LI><H3>無聊寄語</H3></LI></td>
</tr>
<tr>
<td><div id=speakDiv><div></td>
</tr>
<tr>
<td class="midd"><H3><a href="http://blog.csdn.net/bgu/admin/default.aspx"><IMG alt="Manage Center" src="/images/xml.gif" border=0>管理中心</a></H3></td>
</tr>
</table>
</DIV>
<script language="JavaScript">
var content;
content="<table width=180 height=70 class=midd><tr><td>";
content+="　　在茫茫人海中尋找我人生唯一之伴侶，得之，我幸，不得，我之不幸！";
content+="<br>　　　　　　　　　　　--HD";
content+="</LI></td></table>";
document.all("speakDiv").innerHTML=content;
</script>

---------------------------------------------------------------------------------

代碼很簡單，只是在修改Blog代碼的時候注意在HTML里的ID號就可以了！

我這里的修改也只是簡單的改了加了點東西。大家如果有什么更好的意見，可留言！

最后：csdn的Blog不是個人主頁！個性化它，只是讓它個性化自己而已！

原文轉自：http://www.kjueaiud.com