此文长期更新,具体根据我博客的样式判定.
架构: BlackLowKey
页面CSS:
div.prob{
box-shadow:0 0 4px #ccf;
padding: 2px;
text-align:left;
border-radius:6px;
}
div.prob h2{
font-size:30px !important;
font-family:Courier New,微软雅黑;
font-weight:normal !important;
text-align:center;
text-shadow:0 0 1px #888;
}
div.prob h3{
font-size:20px !important;
font-family:Courier New,微软雅黑;
font-weight:normal !important;
border-left:4px solid #39f;
text-shadow:0 0 1px #aaa;
padding-left:3px;
}
pre.indent,div.indent{
text-indent:2em;
font-family:Courier New,宋体;
text-shadow:0 0 1px #aaa;
}
div.prob pre.indent,div.prob div.indent{
font-size:16px;
}
.mono{
font-family:Monaco,Consolas,Ubuntu Mono;
padding:5px;
border:1px solid #ccc;
border-radius:5px;
background:#eee;
text-shadow:0 0 1px #666;
}
*::selection{
background:#acf;
}
body,#navigator{
background:#0068c9;
}
#blogTitle h1 a,
#blogTitle h2,
#navList a:link,
#navList hover,
#navList a:visited,
#navList a:active{
text-shadow:none;
border:none !important;
}
.headermaintitle{
font-size:40px;
}
#navList {
height: 60px;
float: left;
margin-left: 0;
width: 800px;
}
#navList li {
float: left;
height: 60px;
}
#navList li a{
margin-left: 6px;
}
#navList li:hover {
background:rgba(255,255,255,0.4);
}
a:hover,.postCon a:hover{
text-decoration:none !important;
border-bottom:2px solid #acf;
}
.postCon a:link, .postCon a:visited, .postCon a:active {
text-decoration: none;
border-bottom: 2px dashed #acf;
color:#39f;
padding-left:0px;
margin-left: 2px;
}
.postTitle,div.newsItem .catListTitle {
font-size: 14px;
font-weight: bold;
padding: 10px 100px 10px 20px;
background: #E5F0FC;
line-height: 1.5em;
clear: both;
border:none;
border-left: 5px solid #1fa6e6;
}
.newsItem {
background: #ECF5FF;
padding: 0 0 5px 0;
margin-bottom: 2em;
}
.cnblogs_Highlighter *{
font-family:Monaco,Ubuntu Mono,Consolas !important;
}
.CalNextPrev{
width: 20px !important;
height: 20px !important;
background: #acf;
padding: 0 !important;
font-size: 16px !important;
text-align: center !important;
}
.CalNextPrev:hover{
background: #39f;
}
.CalNextPrev a:hover,.CalNextPrev:hover a{
color:white;
}
.CalTitle{
background:#acf;
border:none;
}
.Cal tbody tr:nth-child(2){
background:#cdf;
}
.Cal tbody tr:nth-child(1) td{
padding:0px !important;
}
.CalDayHeader{
border:none;
}
.Cal tbody tr:nth-child(n-2) td{
background:#eef;
}
.CalOtherMonthDay{
background:#def !important;
}
.CalWeekendDay{
background:#4df !important;
}
.CalTodayDay{
background:#aaf !important;
color:white;
font-weight:bold;
}
input[type="text"]{
margin:0px;
border:1px solid transparent;
border-bottom:1px solid #acf;
}
input[type="text"]:hover{
margin:0px;
border:1px solid #e7e7e7;
border-bottom:1px solid #acf;
}
input[type="text"]:focus{
box-shadow:0 0 2px #aaf;
border:1px solid transparent;
border-bottom:1px solid #acf;
}
input:focus{
outline:none;
}
input[type="button"] {
margin: 0px;
border: none;
background: #29af3f;
color: white;
font-weight: bold;
}
input[type="button"] {
margin: 0px;
border: none;
background: #198F2D;
color: white;
font-weight: bold;
}
.catListEssay h3,
.catListLink h3,
.catListNoteBook h3,
.catListTag h3,
.catListPostCategory h3,
.catListPostArchive h3,
.catListArticleArchive h3,
.catListImageCategory h3,
.mySearch h3,
.catListComment h3,
.catListView h3,
.catListFeedback h3,
#blog-sidecolumn .catListTitle {
font-size: 14px;
font-weight: bold;
padding: 10px 100px 10px 20px;
background: #E5F0FC;
line-height: 1.5em;
clear: both;
border:none;
border-left: 5px solid #1fa6e6;
}
.topicListFooter {
background: #6EEBCD;
margin: 0px;
height: 20px;
line-height: 20px;
}
.topicListFooter a {
display:inline-block;
background: #6EEBCD;
margin: 0px;
height: 20px;
line-height: 20px;
}
.topicListFooter a:hover {
display:inline-block;
background: #3AB194;
margin: 0px;
height: 20px;
line-height: 20px;
color:white;
font-weight:bold;
}
#comment_nav a {
padding-left: 0px;
}
宽屏版。。
pre{
font-family:Courier New;
}
div.prob{
box-shadow:0 0 4px #ccf;
padding: 2px;
text-align:left;
border-radius:6px;
}
div.prob h2{
font-size:30px !important;
font-family:Courier New,微软雅黑;
font-weight:normal !important;
text-align:center;
text-shadow:0 0 1px #888;
}
div.prob h3{
font-size:20px !important;
font-family:Courier New,微软雅黑;
font-weight:normal !important;
border-left:4px solid #39f;
text-shadow:0 0 1px #aaa;
padding-left:3px;
}
pre.indent,div.indent,p.indent,blockquote.indent{
text-indent:2em !important;
font-family:Courier New,宋体;
text-shadow:0 0 1px #aaa;
}
div.prob pre.indent,div.prob div.indent,div.prob blockquote.indent{
font-size:16px;
}
blockquote.indent{
border-left: 3px solid #999;
padding-left:2px;
font-weight:bold;
color:#444;
}
blockquote.indent.noindent{
text-indent:0px;
}
.mono,textarea,.syntaxhighlighter code{
font-family:Monaco,Consolas,Ubuntu Mono;
padding:5px;
border:1px solid #ccc;
border-radius:5px;
background:#eee;
text-shadow:0 0 2px rgba(200,200,200,0.6);
}
*::selection{
background:#acf;
}
body,#navigator{
background:#0068c9;
}
#blogTitle h1 a,
#blogTitle h2,
#navList a:link,
#navList hover,
#navList a:visited,
#navList a:active{
text-shadow:none;
border:none !important;
}
.headermaintitle{
font-size:40px;
}
#navList {
height: 60px;
float: left;
margin-left: 0;
width: 800px;
}
#navList li {
float: left;
height: 60px;
}
#navList li a{
margin-left: 6px;
}
#navList li:hover {
background:rgba(255,255,255,0.4);
}
a:hover,.postCon a:hover{
text-decoration:none !important;
border-bottom:2px solid #acf;
}
.postCon a:link, .postCon a:visited, .postCon a:active {
text-decoration: none;
border-bottom: 2px dashed #acf;
color:#39f;
padding-left:0px;
margin-left: 2px;
}
.postTitle,div.newsItem .catListTitle {
font-size: 14px;
font-weight: bold;
padding: 10px 100px 10px 20px;
background: #E5F0FC;
line-height: 1.5em;
clear: both;
border:none;
border-left: 5px solid #1fa6e6;
}
.newsItem {
background: #ECF5FF;
padding: 0 0 5px 0;
margin-bottom: 2em;
}
.cnblogs_Highlighter *{
font-family:Monaco,Ubuntu Mono,Consolas !important;
}
.CalNextPrev{
width: 20px !important;
height: 20px !important;
background: #acf;
padding: 0 !important;
font-size: 16px !important;
text-align: center !important;
}
.CalNextPrev:hover{
background: #39f !important;
}
.CalNextPrev a:hover,.CalNextPrev:hover a{
color:white;
text-decoration:none !important;
border:none !important;
}
.CalTitle{
background:#acf;
border:none;
}
.Cal tbody tr:nth-child(2){
background:#cdf;
}
.Cal tbody tr:nth-child(1) td{
padding:0px !important;
}
.CalDayHeader{
border:none;
}
.Cal tbody tr:nth-child(n-2) td{
background:#eef;
}
.CalOtherMonthDay{
background:#def !important;
}
.CalWeekendDay{
background:#4df !important;
}
.CalTodayDay{
background:#aaf !important;
color:white;
font-weight:bold;
}
input[type="text"]{
margin:0px;
border:1px solid transparent;
border-bottom:1px solid #acf;
}
input[type="text"]:hover{
margin:0px;
border:1px solid #e7e7e7;
border-bottom:1px solid #acf;
}
input[type="text"]:focus{
box-shadow:0 0 2px #aaf;
border:1px solid transparent;
border-bottom:1px solid #acf;
}
input:focus,textarea:focus{
outline:none;
}
input[type="button"] {
margin: 0px;
border: none;
background: #29af3f;
color: white;
font-weight: bold;
}
input[type="button"]:hover {
margin: 0px;
border: none;
background: #198F2D;
color: white;
font-weight: bold;
}
.catListEssay h3,
.catListLink h3,
.catListNoteBook h3,
.catListTag h3,
.catListPostCategory h3,
.catListPostArchive h3,
.catListArticleArchive h3,
.catListImageCategory h3,
.mySearch h3,
.catListComment h3,
.catListView h3,
.catListFeedback h3,
#blog-sidecolumn .catListTitle {
font-size: 14px;
font-weight: bold;
padding: 10px 100px 10px 20px;
background: #E5F0FC;
line-height: 1.5em;
clear: both;
border:none;
border-left: 5px solid #1fa6e6;
}
.topicListFooter {
background: #6EEBCD;
margin: 0px;
height: 20px;
line-height: 20px;
}
.topicListFooter a {
display:inline-block;
background: #6EEBCD;
margin: 0px;
height: 20px;
line-height: 20px;
}
.topicListFooter a:hover {
display:inline-block;
background: #3AB194;
margin: 0px;
height: 20px;
line-height: 20px;
color:white;
font-weight:bold;
}
#comment_nav a {
padding-left: 0px;
}
.comment_digg,.comment_bury,.comment_actions a{
padding: 0px !important;
margin-left: 5px;
}
#navList li a{
margin:0px;
padding:20px;
}
.statusB{
display:block;
border-width:4px;
padding:2px;
border-style:solid;
border-radius: 10px;
}
.statusB.AC{
border-color:green;
}
.statusB.noAC{
border-color:red;
}
.statusB.wait{
border-color: rgb(255, 163, 0);
background: rgb(255, 232, 142);
}
/*added*/
#home,#main{
width:100%;
}
#mainContent{
width:80%;
}
当然了,下次要加上特殊页面的排版要更唯美些.
todo: * BOOK pages typography