These days in CSDN blog to see a lot of people's articles! Also harvest more or less! ^o^
but in the blog interface seems to look at are so traditional a few good-looking points. So on the whim, see if you can change their blog to better look more personalized points! Oh! Now this interface, is the result!
below I put the code posted out, also let everyone's blog more personalized it! The code is simple, just some HTML plus a little JavaScript! The most important thing is to understand the CSS style sheet!
_________________________________
first into your blog Management center, select: Options-> configuration
Enter your own defined CSS style sheet in the Customize CSS selector text box. (Below is the CSS code for my Interface):
---------------------------------------------------------------------------------
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 (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 (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%;
}
---------------------------------------------------------------------------------
then enter HTML or JavaScript code in the text box of the static news/declaration. (Here is the code for my interface):
---------------------------------------------------------------------------------
<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= "align=" "left" valign= "middle" ><LI><H3> boring message </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=http://www.163design.net/a/y/"/images/xml.gif "border=0> Management Centre </A></H3></TD >
</tr>
</table>
</DIV>
<script language= "JavaScript" >
var content;
content= "<table width=180 height=70 class=midd><tr><td>";
content+= "In the boundless Sea of human beings in search of my only companion, get, I am fortunate, do not, my misfortune!" ";
content+= "<br>--HD";
content+= "</LI></td></table>";
document.all ("Speakdiv"). Innerhtml=content;
</script>
---------------------------------------------------------------------------------
code is very simple, just change the blog code when you notice in the HTML ID number on it!
My changes here are simply changed and added something. If you have any better comments, you can leave a message!
Last: Csdn blog is not a personal homepage! Personalize it, just let it personalize itself!
