These days have seen some articles in the 9CBS blog! Also harvested or more! ^ o ^ However, the interface on Blog seems to be such a traditional kind of good look. So I suddenly think, see if I can change my blog better, I have my own personalization! Ah! Now this interface is the result!
Below I put the code out, and let everyone blog more personalized! The code is very simple, but only some html plus a little bit JavaScript! The most important thing is to understand the CSS style sheet!
________________________________
First enter your Blog Management Center, Select: Options -> Configure in the Custom CSS Selector text box Enter your own CSS style sheet. (The following is the CSS code of 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, POSTIVE = 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: #ccccc 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: 1 PX; 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, posTIVE = 1); width: 100%;} ------------------------------------ ---------------------------------------------
Then enter the HTML or JavaScript code in the "Static News / Declaration" text box. (The following is the code of my interface):
-------------------------------------------------- ------------------------------
