更换了blog的样式

     一直认为blog样式的更改会是很麻烦的,可是经过这次的学习,发现原来也是很简单的,当然,这要你首先会一点html和css的基础知识.直奔主题吧,下面来讲讲我更改blog样式的过程.
     我的几个blog,无论是csdn的,还是donews的,都是采用asp.net weblogs的dottext系统,这个系统是由Scott Watermasysk制作的,后来好像是被MS收购去了,如果想更深入的了解你的blog的话,最好是去看他的源代码,可是我不懂.net,这个且不表了.这个系统提供了用户自己修改css的功能,你可以在后台管理--->选项--->配置中找到用户自军定义css的选项,在这里可以输入自己定义的样式.
    在输入样式之前,你需要确定一件事情,那就是网页中各个标签的id都是怎么定义的.dottext提供了几个默认的模板,你可以在配置中选择.不同的配置,页面中标签的定义是不同的,如果你打算自己来改样式的话,一般可以选择lighty这个模板,这个模板改起来相对要好一点.
   选好了模板之后,你打你的blog首页,你就可以通过查看源代码来看网页中的标签了.现在,你就可以进行最重要的css代码编写的过程了.
   下面是我写的一个css的简单的样式,通过自己不断的尝试,就可以做出各种风格的页面来.但是由于受到dottext系统的限制,我们不能改为三栏的页面,这算是一个遗憾吧.

body{margin:0px;
background: #fff url("") repeat-x;
font-family:ms shell dlg;}

#classnavbar {
    display: none;
}

#nadframe {
    display:none;
}

h1 {margin:0px;
background:url("") no-repeat;
height:23px;padding-right:35px;
font-family: ms shell dlg;
font-size:24px;font-weight:bold;
border-bottom:1px dotted #111;

}
h1 a:link,h1 a:active,h1 a:hover{color:#444}   
#Header1_HeaderTitle{color:#339900;float:left;padding:0px 0px 10px 50px;text-align:left;width:100%}
#main {
    width: 74%;
    position: absolute;
    margin-top: 0px;
    border-right: 1px dotted #000000;
    padding-top: 20px;
    margin-bottom: 10px;
    padding-bottom: 40px;
 background:#fff;
}

#rightmenu {
    float: right;
    margin-left: 76%;
    margin-top: 10px;
    padding-left: 0px;
    background-color: transparent;
    position: absolute;
    word-wrap:break-word;
    font-size: 10pt;
}

#footer {
    clear: both;
    width: 100%;
    border-top: none;
    font-size: 8pt;
    padding-top: 5px;
    text-align: center;
    position: relative;
    visibility: hidden;
}

a:visited,
a:active,
a:link {
    color: #80CE00;
    text-decoration: none;
}

a:hover {
    color: #000;
    text-decoration : underline;
    }

blockquote {
    background: #F9F9F9;
    border: 1px solid #F4F4F4;
    color: #5B5B5B;
    font-size: 10pt;
    font-style: normal;
    line-height: 150%;
    padding: 0px 11px 0px 11px;
}

 

h1 a:visited,
h1 a:active,
h1 a:link {

}

h1 a:hover {

}

.post {
    padding-left: 40px;
    padding-right: 0px;
    font-size: 14px;
    line-height:200%
}
h5{font-size:14px;font-family:bold}
.postTitle {
    border-bottom: 1px dotted #D6D6D6;
    color: #000000;
    font-size: 14px;
    font-weight: bold;
 margin:0px 30px 0px 30px;
}

.postText {
    font-size: 14px;
    line-height:180%
 text-align:right;
 margin:0px 30px 0px 30px;
}

h3 {
    font-size: 14px;
    border-bottom: 1px dotted #D6D6D6;
    color: #000000;
    background-color: transparent;
}

.listitem {width:180px;
    border-bottom: 1px dotted #E4E4E4;
    padding-bottom: 3px;
    padding-top: 3px;
}

input,
label {
    color: Gray;
    font-family: Verdana;
    font-size: 10pt;
}

input.text {
    width: 381px;
}

li {
    font-size: 10pt;
    font-style: normal;
}
h2{padding: 0px 0px 0px 20px;margin:0}
.dateTitle {
    color: #ccc;
    font-size: 14px;
    font-weight: bold;
    padding: 0px 0px 0px 20px;
 margin:0px 0px 0px 40px;
    height:26px;
 border-bottom:1px dotted #ccc;
}

p.date img {
    vertical-align: middle;
}

.postFoot {
    border-bottom: 1px dotted #D6D6D6;
    color: #D3D3D3;
    text-align: right;
    font-size: 9pt;
 margin:0px 30px 0px 30px;
}

span.highlight {
    background-color: transparent;
}

td {
    font-size: 10pt;
}

textarea {
    color: #000000;
    font-size: 10pt;
    height: 200px;
    width: 300px;
}

#MyLinks1_XMLLink {
    visibility: hidden;
    display: none;
}

#MyLinks1_Syndication {
    visibility: hidden;
    display: none;
}

.CommentForm {
    border-top: 1px solid #D6D6D6;
    padding-top: 20px;
    color: #A9A9A9;
    padding-left: 70px;
    padding-right: 40px;
 margin:0px 30px 0px 30px;
    }

#comments {
    color: #888;
    padding-left: 70px;
    padding-right: 40px;
    font-size: 10pt;
}

#relatedlinks ul {
    list-style: none;
    margin-left: 10px;
    padding: 0px;
}

#rightmenu h3 {
 width:100px;
    background-color: transparent;
    border: none;
    border-bottom: 1px dotted #D6D6D6;
    color: #111;
    font-size: 12px;
    margin: 10px 20px 0px 0px;
    padding: 2px 5px;
}

#rightmenu ul {
    border: none;
    list-style: none;
    margin: 0px;
    padding: 5px;
    font-size: 9pt;
    line-height:150%;
}

#rightmenu li {
    font-size: 9pt;
}

#tagline {
    color:#444;
    font-size: 12px;
    position : absolute;
    top : 30px;
    left : 250px;
    margin : 0px;
    margin-right : 0px;
    font-family:ms shell dlg;
}

.block_title{font-size:14px;font-weight:bold}
.code{float:left;width:90%;padding:10px;border:1px dotted #d9d9d9;background:#f4f4f4;}
.postFoot{clear:both;padding-top:6px}
br{clear:both;}

i {
    font-style: normal;
    color: Green;
}