绿草蓝天----为博客园又pick了一个SKin

Skin预览图

Skin 名称: 绿草蓝天(FreeBlue)

版式借鉴 keso.cn  素材样式来自网络,图片处理和CSS调试是本人                


使用方法:

① 后台选择CSS样式 为gertrude 

如图




  ② 在 Custom CSS Selectors 中填入一下 CSS定义代码

 

body{}{
 font-size: 12pt;
margin:0px;background: #f8f8f8 url("http://www.cnblogs.com/images/cnblogs_com/xiang/31544/o_headbg.gif") repeat-x;font-family:ms shell dlg;}

#classnavbar {}{
    display: none;
}

p.date{}{  display:none;}

#nadframe {}{
    display:none;
}

h1 {}{margin:0px;
background:url("http://www.cnblogs.com/images/cnblogs_com/xiang/31544/o_head.jpg") no-repeat;height:175px;padding-right:35px;font-family: ms shell dlg;
    font-size:16px;font-weight:bold;border-bottom:6px solid #ADBB88;

}
h1 a:link,h1 a:active,h1 a:hover{}{color:#2E9CE9}    
#Header1_HeaderTitle{}{float:left;padding-top:116px;text-align:right;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: 9pt;
}

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

a:visited,
a:active,
a:link {}{
    color: #2E9CE9;
    text-decoration: none;
}

a:hover {}{
    color: #88BBFF;
    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: 40px;
    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;
}

.postText {}{
    font-size: 14px;
    line-height:180%
}

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;
    width:180px;
table-layout: fixed;
word-wrap:break-word;
}
h2{}{padding: 0px 0px 0px 20px;margin:0}

h2 a:visited,
h2 a:active,
h2 a:link {}{font-size:14px;

}

h2 a:hover {}{font-size:14px;

}
.dateTitle {}{
    
    color: #97AC5F;
    font-size: 14px;
    font-weight: bold;
    padding: 0px 0px 0px 20px;
    height:26px;
}

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

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

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 dotted #D6D6D6;
    padding-top: 20px;
    color: #A9A9A9;
    padding-left: 70px;
    padding-right: 40px;
    }

#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: #000000;
    font-size: 12px;
    margin: 10px 0px 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 {}{
   height:350px;
   width:300px;
    color:#fff;
    font-size: 12px;
    text-align : right;
    vertical-align:baseline; 
    position : absolute; 
    top : 60px;
    right : 40px;
    margin : 0px;
    margin-left : 0px;
       font-family:ms shell dlg;
    background:url("http://www.cnblogs.com/images/cnblogs_com/xiang/31544/o_shenshui.gif") no-repeat;
}

div.RecentComment{}{width: 180px;}

.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;
}
table {}{
table-layout: fixed;
word-wrap:break-word;
}
div,ul {}{
word-wrap:break-word;
}

③ 在公告中加入以下代码
 
<script>document.getElementsByTagName("link")[0].disabled=true;</script>

// 作用是为屏蔽BLOG中原来在程序中定义的外部链接的的CSS样式

④ 保存,并稍微调整下你的博客的子标题的位置

 方法: 在你原来的子标题前 加 七个换行代码

  <br><br><br><br><br><br><br>

使你子标题不与子标题背景重叠

如下图