大峰笔记

使用主题Simple，一下为CSS修改

body{font-family:"Droid Serif",Georgia,Microsoft YaHei,SimHei,Arial,SimSun,sans-serif,Verdana;margin:0}a,body{color:#5d5d5d}a{text-decoration:none}a:active,a:hover{color:#29d}p{margin:0 auto.75em}.clearfix{clear:both}.center{text-align:left;margin:.75em 0}h2,h3{font-weight:600;margin:0;padding:.8em 0}h1{margin:0;padding:0;font-size:1.25em}h2{font-size:1.3em}h3{font-size:1.3em}.title{font-size:1.3em;font-weight: 600;}.archive-title{text-align:center;padding-bottom:20px;font-size:1.3em;font-weight:400;border-bottom:1px dashed #ccc}h2 span{color:#29d;font-weight:700}hr{border:0;background:#eee;height:1px}ol,ul{margin:auto 0;padding-inline-start:16px;list-style-type:none}.post-content ol li,.post-content ul li{margin:.5em 0}table tbody tr:nth-child(odd){background:#f8f8f8}table tbody tr:first-child{text-align:center!important;background:#333;color:#fff}table tbody tr:first-child td{font-weight:normal;}table{margin:10px 0;width:100%;border-collapse:collapse;text-indent:0;border-spacing:0}input,select,textarea{padding:5px;border:1px solid #cccccc;width:100%;border-radius:2px;font:1.04em Arial;box-sizing:border-box;background-color:#faf7f5;}input#author,input#code,input#mail,input#url{width:100%;height: 40px;}blockquote:after,blockquote:before,q:after,q:before{content:""}blockquote{-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none;quotes:none;border-left:.25em solid #29d;margin:1em 0;padding:.25em 1em;word-break:break-word;background:#f7f8fa}blockquote,pre{border-radius:.25em}pre{padding:0 20px;white-space:pre-wrap;word-wrap:break-word;font:14px/22px courier new;position:relative;margin:1em 0;text-indent:0;border-left:.25em solid #29d}pre:after,pre:before{display:block;padding-top:10px;padding-bottom:10px;color:#29d}pre:before{content:"-- CODE --"}pre:after{content:"-- EOF --";text-align:right}code{padding:2px;white-space:pre-wrap;word-wrap:break-word;word-break:break-word;letter-spacing:0;text-indent:0;font:14px/26px courier new;color:#c13}code,pre{background-color:#faf7f5;line-height:2em}pre code{padding:0;color:#111}.container{margin-left:auto;margin-right:auto;padding-left:10px;padding-right:10px;max-width:850px}#header{background:#faf7f5;height:50px;line-height:50px;z-index:9999;position:fixed;width:100%;border-bottom:1px solid #ddd;}#search{display:inline;float:right;padding-left:10px}#search input{background:#f2f2f2;border-radius:3px;border:0;font-size:87.5%;padding:10px 30px 10px 10px}#search button{position:relative;border:0;padding:0;width:24px;height:24px;background:transparent url(../img/search.png) no-repeat 50%;background-size:24px;direction:ltr;text-indent:-9999em;margin-top:-47px;margin-right:5px;float:right;cursor:pointer}#logo{margin-right:30px;float:left}.logo{font-weight:700;width:20%;}.logo img{height:72px}#nav-menu .current-menu-item a,#nav-menu .current-post-parent a{background:linear-gradient(#29d,#29d) bottom no-repeat;background-size:100% 3px;font-weight:700;color:#29d}#menu{text-align:left;margin-top:0;font-size:.9375em}#menu,#menu li{display:inline}#nav-menu a{padding:0 10px;display:inline-block}#nav-menu a:hover{background:linear-gradient(#29d,#29d) bottom no-repeat;background-size:100% 3px}#menubutton{display:none;float:right;background:0 0;border:0;margin-top:18px;cursor:pointer}#menubutton span{float:left;padding:6px 0 7px}#menubutton i{width:25px;height:2px;clear:both;display:block;background-color:#444;margin:5px 0}#main{width:100%;background:#faf7f5;border-radius:6px;padding:70px 0 10px}#footer{clear:both;padding:25px 0;text-align:center;font-size:.875em;border-top:0px;color: #999;}.post{padding:0 0 20px;margin:0 0 20px;border-bottom:1px solid #ddd;font-size:1.04em}.post-head{display:-webkit-flex;display:flex;align-items:center}.post-head time{font-size:.875em;color:#999;}.post-title{flex:1 1 auto}time{width:100%;max-width:100px;color:#556;text-align:right}.post-excerpt{line-height:2em;margin:2px 0 10px;word-break:break-word}.post-excerpt:hover{color:#5d5d5d;cursor:pointer}.post-meta,.posts-meta{margin-top:5px;padding:0;color:#999;font-size:.875em;display:flex}.post-meta a,.posts-meta a,.tags a{color:#556}.post-meta a:hover,.posts-meta a:hover,.tags a:hover{color:#222}.post-meta{text-align:right;list-style:none;display:inherit;border-bottom:1px solid #ddd;margin: -39px 0 20px 0;padding-bottom: 20px;}.post-meta li{color:#556;background:#f3f3f3;padding:2px 5px;border:1px solid #eaeaea;border-radius:12px;font-size:87.5%;list-style:none;margin:0 1px;display:inline}.post-meta li:last-child{margin-right:0}.post-meta li:hover{background:#e3e3e3}.tags{line-height:2em;font-size:1.04em;overflow:hidden;background-color:#faf7f5;padding:3px 10px;margin:5px 0;}.post-near{margin:15px 0;font-size:1.04em}.post-near li{list-style:none;padding-bottom:10px}.post-left{float:left}.post-left,.post-right{word-break:keep-all;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:40%}.post-right{float:right;text-align:right;direction:rtl}li.post-right:before{border-left:6px solid #ddd;margin-left:5px}li.post-left:before,li.post-right:before{display:inline-block;content:"";border-top:5px solid transparent;border-bottom:5px solid transparent}li.post-left:before{border-right:6px solid #ddd;margin-right:5px}li.post-left:hover:before{border-right:6px solid #29d}li.post-right:hover:before{border-left:6px solid #29d}.posts-meta li{color:#556;background:#f3f3f3;padding:2px 5px;border:1px solid #eaeaea;border-radius:12px;font-size:87.5%;margin-right:auto;list-style:none}.posts-meta li:last-child{margin-right:0}.posts-meta li:hover{background:#e3e3e3}#more{margin:10px 0;padding:0 0 0 10px;border-left:.2em solid #29d}.more-list{list-style:none;margin:0 0 -15px}.more-list li{padding:5px 0;word-break:keep-all;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:inline-block;width:49%}.more-list li:before,.widget-list-more li:before{display:inline-block;content:"";background-color:#ddd;height:6px;width:6px;border-radius:100%;margin-right:6px;margin-bottom:2px}.more-list li:hover:before,.widget-list-more li:hover:before{background-color:#29d}.page-navigator{list-style:none;margin:35px 0 10px;padding:0;text-align:center;font-size:1.04em}.page-navigator a,.page-navigator li,.page-navigator span{display:inline-block;margin:0 4px;height:30px;width:30px;border:0px;border-radius:2px}.page-navigator a,.page-navigator span{line-height:30px}.page-navigator a:hover,.page-navigator span:hover,.page-numbers.current{background: #29d;color: #faf7f5;}.page-numbers.current{color:#faf7f5}.post-content{line-height:2em;word-break:break-word}.post-content h1,.post-content h2,.post-content h3{margin:1em 0;padding:0}.post-content h1:before{content:"#";color:#bd19da;margin-right:5px}.post-content h2:before{content:"#";color:#1998da;margin-right:5px}.post-content h3:before{content:"#";color:#f77b83;margin-right:5px}.post-content a{color: #29d;}.post-content a:hover{background: linear-gradient(to bottom,#faf7f5 70%, #f77b83 0%) no-repeat;}.post-content img{max-width:100%;height:auto;display:block;border-radius: 3px;
-webkit-box-shadow: 0 0 7px #333;}.reward{padding:10px 0;margin:10px auto;width:100%;font-size:16px;text-align:center}#QR{padding-top:20px}#QR a{border:0}#QR img{width:150px;max-width:100%;display:inline-block;margin:.5em .5em 0;border:1px solid #ddd;padding:3px;background:#f7f8fa}#QR img:hover{border:1px solid #29d}#rewardButton{border:1px solid#f77b83;background-color:#fff;line-height:36px;text-align:center;cursor:pointer;height:36px;display:block;border-radius:4px;transition-duration:.4s;color:#f77b83;margin:0 auto;padding:0 25px;outline-style:none}#rewardButton:hover{color:#fff;background-color:#f77b83;border-color:#f77b83;outline-style:none}#misubmit{border:0;cursor:pointer;border-radius:2px;text-indent:0;text-decoration:none;color:#fff;padding:7px 10px;width:100%;font-size:1.04em;background: #29d;height: 50px;margin-top: 0.75em;box-shadow: 3px 5px 5px #ccc;}#comments h2,#response{margin:20px 0;padding:0 0 0 10px;border-left:.25em solid #5d5d5d;border-bottom-left-radius: 30px 150px;line-height: 2em;}#comments{margin-top:10px;font-size:.9375em}#comment-form label{display:inline-block;margin-bottom:.5em;width:4pc}#comment-form .required:after{content:" *";color:#f77b83}.comment-reply{display:inline-block;position:absolute;right:0;top:15px}.comment-a a{float:left;padding-right:5px;color:#29d}.comment-content{line-height:1.7em;padding-left:42px}.cancel-comment-reply a,.comment-reply a{margin:15px 0 0;padding:.25em .5em;border-radius:.25em;background-color:#29d;color:#fff!important;font-size:.75em}.cancel-comment-reply a{margin:15px 0 0}.comment-list,.comment-list ol{list-style:none;margin:0;padding:0}.comment-children{padding-left:2em}.comment-list li{margin:0;position:relative}.comment-list li ol li{border-right:0;display:list-item;padding-left:10px}.comment-meta a{color:#999;font-size:.75em}.comment-author{display:block;color:#5d5d5d;border-top:1px dashed #ccc;padding-top:15px;font-weight: 600;}.comment-author .avatar{float:left;margin-right:10px;border-radius:5px}.comment-meta{margin-top:-3px}.comment-author cite{font-size:1.04em;font-style:normal}.comment-by-author:after{content:"博主";color:#fff;background:#29d;padding:0 4px;border-radius:3px;margin-left:5px;font-size:.75em}.comment-list .respond{border-top:1px solid #eaeaea;margin-top:15px}.respond .cancel-comment-reply{float:right;margin-top:1em}.subcolor{color:#29d}.link-menu ul li{display:inline;margin:0 5px}#menu-link{padding-bottom:5px}#cornertool{right:50%;margin-right:-600px;position:fixed;bottom:20px;z-index:999}#cornertool .hidden{visibility:hidden;opacity:0}#cornertool ul{list-style:none;padding:0;margin:0;text-align:center}#cornertool li{position:relative;display:block;left:0;width:36px;height:36px;line-height:36px;margin-top:5px;color:#faf7f5;background:#5d5d5d;border-radius:7%;visibility:visible;opacity:1;cursor:pointer}#percentage{font-size:75%}#top:hover:before{content:"\25b2"}#top:hover span{display:none}@media(max-width:1210px){#cornertool{right:10px;margin:0}}@media(max-width:800px){#main{padding:60px 0 10px}#header,#main{transition:none}#header{line-height:56px}#header,#logo{height:56px}#header,#menu{background:#faf7f5}#menu{width:100%;padding:0;margin:1px 0 0;list-style-type:none;display:none}#menu li{width:100%;display:inline;text-align:right;line-height:3pc}#menubutton{display:inline-block;float:right;margin-top:8px}#nav-menu a{margin:0 4%}.logo img{height:56px}#search button{margin-top:-34px;cursor:pointer}#search input{background:hsla(0,0%,100%,.15);border-radius:0;margin-right:0;border:0;border-bottom:1px solid #e9e9e9;padding-right:24px}#search{width:92%;padding:0 4%}#footer{background:#faf7f5;padding:18px 0}.post{padding:0;margin:0;border-bottom:1px dashed #eee}.post-excerpt,.posts-meta{display:none}.post-title{font-size:1.125em;font-weight:400;line-height:1.6em}.page-navigator{margin:15px 0 10px;font-size:.75em}.more-list{margin:0 0 5px}.more-list li{width:100%}#QR img{width:128px;margin:.5em .5em 0}}

html {scrollbar-width: thin;scrollbar-color: #5d5d5d #faf7f5;background-color:#faf7f5;}

blockquote, pre {
border-left: 8px solid #5d5d5d;
border-right: 8px solid #5d5d5d;
border-bottom-left-radius: 30px 255px;
border-bottom-right-radius: 255px 25px;
border-top-left-radius: 255px 25px;
border-top-right-radius: 30px 225px;
background-color: #faf7f5;padding: 20px;}

h9 {font-size: 2.5em;margin-right: 10px;color: #f77b83;font-weight: bolder;rotate: 45deg;}

#misubmit {background: linear-gradient(-45deg, #fada5c, #ee7752, #f77b83, #e73c7e, #23a6d5, #23d5ab);background-size: auto;background-size: 1000% 1000%;animation: gradientBG 40s ease infinite;}

/* 动画，控制背景 background-position */
@keyframes gradientBG {
0% {
background-position: 0% 50%;
}
50% {
background-position: 100% 50%;
}
100% {
background-position: 0% 50%;
}
}

.tags {background: repeating-linear-gradient(-45deg, transparent, transparent 10px, #ddd 10px, #ddd 20px),linear-gradient(to bottom, #faf7f5, #faf7f5);opacity: 0.6;border-radius: 3px;}

#search input {background: repeating-linear-gradient(45deg, transparent, transparent 10px, #ddd 10px, #ddd 20px),linear-gradient(to bottom, #faf7f5, #faf7f5);opacity: 0.6;}

h11:hover {background: #f77b83;color: #faf7f5;}

首页模板修改

🔊 简单的就是可靠的，复杂的往往容易出问题+

归档页面

碎语页面