csdn_blog的样式实在不怎么样,今天详细看了一下,编辑一下自己的css文件,收获不少:
首先,定义了一下必要的标签
a{
text-decoration: none;
}
A:link {
COLOR: #006bad;
}
A:visited {
COLOR: #666;
}
A:active {
COLOR: #006bad;
}
A:hover {
COLOR: #0000ff;
}
b{
font-size: xx-small;
font-weight: normal;
color: #999;
}
p{
text-indent: 8px;
}
H3 {
COLOR: #333;
TEXT-DECORATION: none;
FONT-SIZE: 14px;
}
接着是blog的特定ID及类型
#top {
PADDING: 0px;
BORDER-TOP: #666 0px solid;
MARGIN: 0px;
COLOR: whitesmoke;
BORDER-BOTTOM: #999 2px solid;
BACKGROUND-REPEAT: repeat
}
#footer {
CLEAR: both;
PADDING: 0px;
FONT-SIZE: 12px;
WIDTH: 100%;
COLOR: #363636;
BACKGROUND-COLOR: #fff;
TEXT-ALIGN: center;
BORDER-top: #006bad 2px solid;
}
#main {
PADDING: 10px;
MARGIN-LEFT: 180px;
BORDER-LEFT: #666 0px solid;
BORDER-BOTTOM: black 0px solid;
BACKGROUND-COLOR: white
}
#leftmenu {
LEFT: 0px;
WIDTH: 180px;
PADDING-TOP: 0px;
POSITION: absolute;
HEIGHT: auto;
BACKGROUND-COLOR: #fff;
BORDER: gainsboro 1px solid;
}
#leftmenu H3 {
PADDING: 3px 3px 0px 15px;
FONT-SIZE: 0.8em;
MARGIN: 0px 0px 0px 0px;
background-color: #fafafa;
BORDER-bottom: #eee 1px solid;
}
#leftmenu A:active {
color: #006bad;
}
#leftmenu A:visited {
color: #006bad;
}
#leftmenu A:link {
color: #006bad;
}
#leftmenu A:hover {
color: #0000ff;
font-style: normal;
}
#leftmenu UL {
PADDING: 0px 0px 10px 30px;
FONT-SIZE: 8pt;
MARGIN: 0px 0px 0px 0px;
LIST-STYLE-TYPE: none
}
DIV.post {
BORDER: gainsboro 1px solid;
}
DIV.postTitle {
PADDING: 3px 0px 0px 10px;
FONT-WEIGHT: bold;
FONT-SIZE: 14px;
BORDER-BOTTOM: #eee 1px solid;
BACKGROUND-COLOR: whitesmoke
}
DIV.postText {
PADDING: 0px 10px 5px 20px ;
FONT-SIZE: 14px ;
}
DIV.postFoot {
PADDING: 0px 5px 0px 0px ;
color: #333;
BORDER-TOP: #eee 1px solid;
}
DIV.postTitle a{
color: #007bad;
}
DIV.postTitle span{
font-size: xx-small;
color: #333;
font-weight: lighter;
}
.BlogStatsBar {
FONT-SIZE: 8pt;
}
.HeaderTitles {
PADDING: 15px 10px 10px 20px ;
font-family: "Trebuchet MS";
}
.HeaderTitles A:visited {
font-weight: bold;
}
.HeaderTitles A:active {
font-weight: bold;
}
.HeaderTitles A:link {
font-weight: bold;
}
.HeaderTitles A:hover {
font-weight: bold;
}.HeaderBarTab A:visited {
color: #fff;font-weight: bold;
}
.HeaderBarTab A:active {
color: #fff;font-weight: bold;
}
.HeaderBarTab A:link {
color: #fff;font-weight: bold;
}
.HeaderBarTab A:hover {
color: #333;font-weight: bold;
}
P.date {
color: #333;
}
最后还特定了code的样式:
PRE{
border: #ccc 1px solid;
background-color: #fdfdfd;
color: #666;
font-family: "Courier New";
font-size: 12px;
text-transform: lowercase;
margin: 5px 20px 5px 20px;
padding: 5px;
}:)
说实话,csdn的文本编辑器实在很烂,呵呵