本博客首页样式
本博客基于Mountainlnk样式进行修改
修改的最主要目的是：最大限度突出文章内容，扩展文章边界，便于阅读
注意：不建议修改，web端看没问题，但是app端查看时，样式不经如意
复制css链接：本博客样式下载
css 样式预览：
css详细内容：之所以保留一下内容，是防止以后我们引用他人的样式覆盖原先亲自设计的样式
#EntryTag {
position: relative;
width: 100%;
height: auto;
margin: 20px 0 20px 0;
border: none;
padding: 0
}
.topicListFooter {
position: relative;
width: 100%;
height: 30px;
margin: 0;
border: none;
padding: 0 20px 20px 20px;
text-align: right
}
#divRefreshComments {
position: relative;
width: 100%;
height: 30px;
margin: 0 20px 0 20px;
border: none;
padding: 0;
text-align: right
}
* {
margin: 0;
padding: 0
}
body {
margin: 0;
padding: 0;
background-color: #f4ede3;
font-family: verdana,Arial,Helvetica,sans-serif;
font-size: 12px;
line-height: 1.5
}
fieldset,img {
border: 0
}
div {
background-color: Transparent
}
table {
border-spacing: 0;
border-collapse: collapse
}
ul {
word-break: break-all
}
li {
list-style: none
}
a:link {
color: #666;
font-family: Arial,Helvetica,sans-serif;
font-size: 12px;
font-weight: normal;
text-decoration: none
}
a:visited {
color: #f00;
font-family: Arial,Helvetica,sans-serif;
font-size: 12px;
font-weight: normal;
text-decoration: none
}
a:hover {
color: #666;
font-family: Arial,Helvetica,sans-serif;
font-size: 12px;
font-weight: normal;
text-decoration: underline
}
a:active {
color: #f00;
font-family: Arial,Helvetica,sans-serif;
font-size: 12px;
font-weight: normal;
text-decoration: none
}
#home {
position: absolute;
left: 0;
z-index: 100;
width: 100%;
height: auto;
margin: 0;
border: none;
padding: 0;
background-color: #f4ede3;
background-image: url(images/top.jpg);
background-position: top center;
background-repeat: no-repeat;
font-family: 微软雅黑;
}
#header {
position: unset;
left: auto;
width: 100%;
height: 105px;
margin: auto;
border: none;
padding: 0;
background: none;
border: 1px solid #ccc;
}
#blogTitle {
position: relative;
left: 0%;
width: 50%;
height: 75px;
margin: 0;
border: none;
padding: 0px;
background: none;
float: left;
}
#blogTitle h1 {
float: left;
margin: 0;
border: none;
padding: 0
}
#blogTitle a {
color: #000;
font-family: 微软雅黑,幼圆,微软雅黑,微软雅黑;
font-size: 36px;
font-weight: bolder;
padding-left: 20px;
}
#blogTitle h2 {
float: inherit;
width: 100%;
margin-left: 52px;
border: none;
padding: 0;
color: #666;
font-family: Arial,Helvetica,sans-serif;
font-size: 18px;
font-weight: normal;
text-decoration: none;
}
#blogLogo {
float: left;
margin: 0;
border: none;
padding: 0
}
#navigator {
position: relative;
display: inline-block;
overflow: hidden;
left: 0;
height: 75px;
width: 50%;
float: right;
line-height: 56px;
}
#navList {
min-height: 40px;
float: left
}
#navList li {
float: left
}
#navList a {
display: block;
width: 115px;
height: 31px;
float: left;
text-align: center;
padding-top: 6px;
font-size: 18px;
font-family: 微软雅黑,微软雅黑,微软雅黑,微软雅黑;
}
#navList a:link,#navList a:visited,#navList a:active {
color: #399ab2
}
#navList a:hover {
font-size: 18px;
color: #000;
text-decoration: none
}
#navList img {
padding-top: 6px
}
.blogStats {
float: right;
margin: 0px;
border: none;
padding-top: 17px;
background: none;
color: #666;
font-family: Arial,Helvetica,sans-serif;
font-size: 14px;
font-weight: normal;
text-decoration: none;
}
#footer {
position: relative;
left: auto;
width: 950px;
height: auto;
margin: auto;
border: none;
padding: 30px 0 30px 0;
background: none;
color: #666;
font-family: Arial,Helvetica,sans-serif;
font-size: 14px;
font-weight: normal;
text-decoration: none;
text-align: center;
}
#main {
position: relative;
left: auto;
width: 100%;
height: auto;
margin: auto;
border: none;
padding-right: 0;
}
#mainContent {
float: right;
width: 86%;
}
#mainContent .forFlow {
background-position: right top
}
.day {
position: relative;
width: 100%;
height: auto;
margin: 0 20px 0 20px;
border: none;
padding: 0
}
.dayTitle {
display: none
}
.postTitle {
position: relative;
width: 100%;
margin: 0;
border: none;
padding: 0
}
.postTitle a {
color: #6a6352;
font-family: 微软雅黑,华文细黑,黑体,Arial;
font-size: 18px;
font-weight: normal
}
.postCon {
position: relative;
width: 100%;
height: auto;
margin: 10px 0 0 0;
border: none;
padding: 0;
color: #494949;
font-family: Arial,Helvetica,sans-serif;
font-size: 14px;
font-weight: normal;
text-decoration: none;
line-height: 1.4
}
.postCon a {
color: #494949;
font-family: Arial,Helvetica,sans-serif;
font-size: 14px;
font-weight: normal
}
.postDesc {
position: relative;
width: 100%;
height: 30px;
margin: 0;
border-bottom: #ccc 1px dashed;
padding: 0;
color: #666;
font-family: Arial,Helvetica,sans-serif;
font-size: 12px;
font-weight: normal;
text-decoration: none;
line-height: 1.4
}
.postSeparator {
display: none
}
#sideBar {
height: auto;
float: left;
border: 1px solid #ccc;
}
#sideBarMain {
position: relative;
width: 205px;
height: auto;
margin: 0;
border: none;
padding: 0;
background: none
}
#leftcontentcontainer {
position: relative;
width: 205px;
height: auto;
margin: 0;
border: none;
padding: 0;
background: none
}
.newsItem {
position: relative;
width: 185px;
height: auto;
margin: 0 0 15px 0;
border: none;
padding: 10px;
color: #6a6352;
font-family: Arial,Helvetica,sans-serif;
font-size: 12px;
font-weight: normal;
text-decoration: none
}
.newsItem a {
color: #6a6352;
font-family: Arial,Helvetica,sans-serif;
font-size: 12px;
font-weight: normal
}
.newsItem .catListTitle {
position: relative;
top: -10px;
left: -10px;
width: 195px;
height: 19px;
margin: 0;
border-bottom: #d6dddc 1px solid;
padding: 5px 0 0 10px;
background-color: Transparent;
color: #55626e;
font-family: Arial,Helvetica,sans-serif;
font-size: 14px;
font-weight: bold;
text-decoration: none
}
#calendar {
position: relative;
width: 205px;
height: auto;
margin: 0 0 15px 0;
border: none;
padding: 24px 0 0 0;
background-color: #f4ede3
}
#calendar .Cal {
position: relative;
width: 205px;
height: auto;
margin: 0;
border-top: #d6dddc 1px solid;
padding: 0;
background-color: Transparent
}
.Cal {
cursor: default;
color: #6a6352;
font-family: Arial,Helvetica,sans-serif;
font-size: 14px;
font-weight: normal;
text-decoration: none;
line-height: 20px
}
.CalTitle {
width: 200px;
color: #6a6352;
font-weight: bold;
line-height: 30px;
text-align: center
}
.CalDayHeader {
font-weight: bold
}
.CalTodayDay {
color: #f60000
}
#calendar table a:hover {
background-color: #f66000;
font-weight: bold
}
.catListTitle {
position: relative;
width: 195px;
height: 19px;
margin: 0;
border-bottom: #d6dddc 1px solid;
padding: 5px 0 0 10px;
background-color: Transparent;
color: #55626e;
font-family: Arial,Helvetica,sans-serif;
font-size: 14px;
font-weight: bold;
text-decoration: none
}
.catListComment {
position: relative;
width: 205px;
height: auto;
margin: 0 0 15px 0;
border: none;
padding: 0
}
.divRecentCommentAticle {
position: relative;
width: 185px;
height: auto;
margin: 10px 10px 0 10px;
border: none;
padding: 0
}
.divRecentCommentAticle a {
color: #6a6352;
font-family: Arial,Helvetica,sans-serif;
font-size: 12px;
font-weight: bold;
line-height: 20px
}
.divRecentComment {
position: relative;
width: 185px;
height: auto;
margin: 0 10px 10px 10px;
border-bottom: #ccc 1px dashed;
padding: 0;
color: #6a6352;
font-family: Arial,Helvetica,sans-serif;
font-size: 12px;
font-weight: normal;
text-decoration: none;
line-height: 20px
}
#sideBarMain ul {
position: relative;
width: 185px;
height: auto;
margin: 0;
border: none;
padding: 10px;
color: #6a6352;
font-family: Arial,Helvetica,sans-serif;
font-size: 12px;
font-weight: normal;
text-decoration: none;
line-height: 20px
}
#sideBarMain ul a {
color: #6a6352;
font-family: Arial,Helvetica,sans-serif;
font-size: 12px;
font-weight: normal;
line-height: 20px
}
#topics {
position: relative;
width: 100%;
height: auto;
margin: 0;
border: none;
padding: 0;
}
#topics .postTitle {
position: relative;
width: auto;
margin: 0;
border: none;
padding: 0;
border-bottom: 1px solid #ddd;
}
#topics .postTitle a {
color: #6a6352;
font-family: 微软雅黑,华文细黑,黑体,Arial;
font-size: 18px;
font-weight: bold
}
.postBody {
position: relative;
width: auto;
height: auto;
margin: 0;
border: none;
padding: 0;
color: #494949;
font-family: Arial,Helvetica,sans-serif;
font-size: 14px;
font-weight: normal;
text-decoration: none;
line-height: 1.6;
}
.postBody a {
color: #494949;
font-family: Arial,Helvetica,sans-serif;
font-size: 14px;
font-weight: normal;
text-decoration: underline
}
.postBody blockquote {
background: beige;
border: 1px solid #878787;
padding-left: 10px;
padding-right: 10px;
padding-top: 5px;
padding-bottom: 5px;
margin-top: 10px;
margin-bottom: 10px;
}
#topics .postDesc {
position: relative;
width: 100%;
height: 30px;
margin: 0;
border-bottom: #ccc 1px dashed;
padding: 0;
color: #666;
font-family: Arial,Helvetica,sans-serif;
font-size: 12px;
font-weight: normal;
text-decoration: none
}
.feedback_area_title {
position: relative;
width: 100%;
height: 20px;
margin: 0 20px 0 20px;
border: none;
padding: 0;
color: #55626e;
font-family: Arial,Helvetica,sans-serif;
font-size: 14px;
font-weight: bold;
text-decoration: none
}
.feedbackItem {
margin-top: 10px
}
.feedbackManage {
position: relative;
height: 20px;
margin: 0 20px 0 20px;
border: none;
padding: 0;
float: right
}
.feedbackManage a {
color: #6a6352;
font-family: Arial,Helvetica,sans-serif;
font-size: 12px;
font-weight: normal
}
.feedbackListSubtitle {
position: relative;
widows: 100%;
height: auto;
margin: 0 20px 0 20px;
border: none;
padding: 0;
color: #6a6352;
font-family: Arial,Helvetica,sans-serif;
font-size: 12px;
font-weight: normal;
text-decoration: none
}
.feedbackListSubtitle a {
color: #6a6352;
font-family: Arial,Helvetica,sans-serif;
font-size: 12px;
font-weight: normal
}
.feedbackCon {
position: relative;
width: 100%;
height: auto;
margin: 0 20px 0 20px;
border: #ccc 1px dashed;
padding: 5px;
color: #878787;
font-family: Arial,Helvetica,sans-serif;
font-size: 12px;
font-weight: normal;
text-decoration: none
}
.feedbackCon a {
color: #878787;
font-family: Arial,Helvetica,sans-serif;
font-size: 12px;
font-weight: normal
}
.entrylistTitle,.PostListTitle {
width: 100%;
height: auto;
margin: 0 20px 0 20px;
border: none;
padding: 0;
color: #55626e;
font-family: Arial,Helvetica,sans-serif;
font-size: 14px;
font-weight: bold;
text-decoration: none
}
.entrylistDescription {
position: relative;
width: 100%;
height: auto;
margin: 5px 20px 20px 20px;
border: none;
padding: 0;
color: #55626e;
font-family: Arial,Helvetica,sans-serif;
font-size: 12px;
font-weight: normal;
text-decoration: none
}
.entrylistItem {
position: relative;
width: 100%;
height: auto;
margin: 0 20px 0 20px;
border-bottom: #ccc 1px dashed;
padding: 10px 0 10px 0
}
.entrylistPosttitle {
position: relative;
width: 100%;
height: auto;
margin: 0;
border: none;
padding: 0
}
.entrylistPosttitle a {
color: #6a6352;
font-family: Arial,Helvetica,sans-serif;
font-size: 14px;
font-weight: normal
}
.entrylistPostSummary {
position: relative;
width: 100%;
height: auto;
margin: 0;
border: none;
padding: 10px 0 10px 0;
color: #494949;
font-family: Arial,Helvetica,sans-serif;
font-size: 12px;
font-weight: normal;
text-decoration: none
}
.entrylistPostSummary a {
color: #494949;
font-family: Arial,Helvetica,sans-serif;
font-size: 12px;
font-weight: normal
}
.entrylistItemPostDesc {
position: relative;
width: 100%;
height: auto;
margin: 0;
border: none;
padding: 0;
color: #666;
font-family: Arial,Helvetica,sans-serif;
font-size: 12px;
font-weight: normal;
text-decoration: none
}
.entrylist .postSeparator {
display: none
}
.Pager {
position: relative;
width: 100%;
height: auto;
margin: 5px 20px 20px 20px;
border: none;
padding: 0;
text-align: right
}
.PostList {
position: relative;
width: 100%;
height: auto;
margin: 0 20px 0 20px;
border-bottom: #ccc 1px dashed;
padding: 10px 0 10px 0
}
.postTitl2 {
position: relative;
width: 100%;
height: auto;
margin: 0;
border: none;
padding: 0
}
.postTitl2 a {
color: #6a6352;
font-family: Arial,Helvetica,sans-serif;
font-size: 14px;
font-weight: normal
}
.postDesc2 {
position: relative;
width: 100%;
height: auto;
margin: 0;
border: none;
padding: 0;
color: #666;
font-family: Arial,Helvetica,sans-serif;
font-size: 12px;
font-weight: normal;
text-decoration: none
}
.postText2 {
position: relative;
width: 100%;
height: auto;
margin: 10px 0 0 0;
border: none;
padding: 0;
color: #494949;
font-family: Arial,Helvetica,sans-serif;
font-size: 12px;
font-weight: normal;
text-decoration: none
}
.postText2 a {
color: #494949;
font-family: Arial,Helvetica,sans-serif;
font-size: 12px;
font-weight: normal
}
.pfl_feedback_area_title {
position: relative;
width: 100%;
height: auto;
margin: 20px 20px 20px 20px;
border: none;
padding: 0;
color: #55626e;
font-family: Arial,Helvetica,sans-serif;
font-size: 14px;
font-weight: bold;
text-decoration: none
}
.pfl_feedbackItem {
position: relative;
width: 100%;
height: auto;
margin: 0 20px 0 20px;
border-bottom: #ccc 1px dashed;
padding: 10px 0 10px 0
}
.pfl_feedbacksubtitle {
position: relative;
width: 100%;
height: auto;
margin: 0;
border: none;
padding: 0
}
.pfl_feedbackname {
position: relative;
width: 100%;
height: auto;
margin: 0;
border: none;
padding: 0;
color: #6a6352;
font-family: Arial,Helvetica,sans-serif;
font-size: 14px;
font-weight: normal;
text-decoration: none
}
.pfl_feedbackname a {
color: #6a6352;
font-family: Arial,Helvetica,sans-serif;
font-size: 14px;
font-weight: bold
}
.pfl_feedbackManage {
position: relative;
width: 100%;
height: auto;
margin: 0;
border: none;
padding: 0
}
.pfl_feedbackCon {
position: relative;
width: 100%;
height: auto;
margin: 0;
border: none;
padding: 10px 0 10px 0;
color: #878787;
font-family: Arial,Helvetica,sans-serif;
font-size: 12px;
font-weight: normal;
text-decoration: none
}
.pfl_feedbackAnswer {
position: relative;
width: 100%;
height: auto;
margin: 0;
border: none;
padding: 0;
color: #494949;
font-family: Arial,Helvetica,sans-serif;
font-size: 12px;
font-weight: normal;
text-decoration: none
}
.gallery {
position: relative;
width: 100%;
height: auto;
margin: 0 20px 0 20px;
border: none;
padding: 0
}
.thumbTitle {
color: #55626e;
font-family: Arial,Helvetica,sans-serif;
font-size: 14px;
font-weight: bold;
text-decoration: none
}
.thumbDescription {
position: relative;
width: 100%;
height: auto;
margin: 5px 0 20px 0;
border: none;
padding: 0;
color: #55626e;
font-family: Arial,Helvetica,sans-serif;
font-size: 12px;
font-weight: normal;
text-decoration: none
}
.thumbDescription a {
color: #55626e;
font-family: Arial,Helvetica,sans-serif;
font-size: 12px;
font-weight: normal
}
.divPhoto {
margin: 10px;
border: #ccc 1px solid;
padding: 2px
}
#AjaxHolder_PostComment_divCommnentArea {
position: relative;
width: 100%;
height: auto;
margin: 0 20px 0 20px;
border: none;
padding: 0;
color: #55626e;
font-family: Arial,Helvetica,sans-serif;
font-size: 14px;
text-decoration: none;
line-height: 30px
}
.personInfo img {
margin: 0 20px 20px 20px;
border: #ccc 1px solid;
padding: 2px
}
.userDocument {
color: #666;
font-family: Arial,Helvetica,sans-serif;
font-size: 12px;
font-weight: normal;
text-decoration: none
}
.userDocument b {
color: #55626e;
font-family: 微软雅黑,华文细黑,黑体,Arial;
font-size: 18px;
font-weight: normal;
text-decoration: none;
line-height: 50px
}
.pages {
position: relative;
width: 100%;
height: auto;
margin: 0 20px 0 20px;
border: none;
padding: 0;
color: #666;
font-family: Arial,Helvetica,sans-serif;
font-size: 12px;
font-weight: normal;
text-decoration: none;
text-align: right
}
#Profile1_panelAdd {
position: relative;
width: 100%;
height: auto;
margin: 0 20px 0 20px;
border: none;
padding: 0;
color: #55626e;
font-family: Arial,Helvetica,sans-serif;
font-size: 14px;
text-decoration: none;
line-height: 30px
}
.commentform {
position: relative;
width: 100%;
height: auto;
margin: 0 20px 0 20px;
border: none;
padding: 0
}
.commentform p,.commentform span {
color: #55626e;
font-family: Arial,Helvetica,sans-serif;
font-size: 14px;
font-weight: normal;
text-decoration: none;
line-height: 30px
}
#comment_nav {
position: relative;
width: 100%;
height: 30px;
margin: 0;
border: none;
padding: 0;
text-align: right
}
#commentform_title {
color: #6a6352
}
.commentbox_title {
margin-bottom: 0
}
.commentbox_title_left {
color: #6a6352
}
.commentbox_title_right {
float: right;
width: auto;
margin: 0;
border: none;
padding: 0
}
.comment_btn {
width: 80px
}
#relative_search,.c_ad_block {
position: relative;
min-width: 0;
min-height: 0;
margin: 10px 0 0 0;
border: #ccc 1px dashed;
padding: 5px;
color: #55626e;
font-family: Arial,Helvetica,sans-serif;
font-size: 14px;
font-weight: bold;
text-decoration: none;
line-height: 30px
}
.galleryTitle {
position: relative;
width: 100%;
height: auto;
margin: 0;
border: none;
padding: 0;
color: #55626e;
font-family: Arial,Helvetica,sans-serif;
font-size: 14px;
font-weight: bold;
text-decoration: none
}
.comment_pager {
padding-left: 20px;
font-size: 12px;
color: #6a6352
}
.post {
padding-left: 20px
}
.div_my_zzk {
margin-left: 10px
}
.mySearch {
padding-bottom: 5px
}
#cnblogs_post_body .postTitle {
height: auto
}
@media only screen and (max-width:767px) {
#home {
width: auto;
position: static
}
#blogTitle {
width: auto;
padding: 0 10px
}
#header {
width: auto
}
#sideBar {
width: auto;
float: none
}
#sideBarMain {
width: auto
}
#mainContent {
float: none
}
#main {
width: auto;
padding-right: 10px
}
#topics .postTitle,.postBody,#topics {
width: auto
}
.blogStats {
margin-right: 10px
}
.feedbackCon {
width: auto;
font-size: 13px
}
#leftcontentcontainer,.catListComment,.catListTitle,#sideBarMain ul,.commentform,#topics .postDesc {
width: auto
}
.newsItem {
margin: 0 20px 15px 20px
}
#blog-calendar {
margin: 0 20px
}
#green_channel {
width: auto !important
}
}
#MySignature {
display: none;
border-top: 1px solid #ddd;
padding-top: 10px;
}
div.commentform textarea {
width: 60%;
height: 300px;
font-size: 13px;
border: 1px solid #ccc;
font-family: 'PingFang SC','Helvetica Neue','Helvetica','Arial',sans-serif;
}
浙公网安备 33010602011771号