├── README.md
├── 页尾.html
├── 页面定制.css
└── 页首.html


/README.md:
--------------------------------------------------------------------------------
 1 | ## 食用方法
 2 | 
 3 | 1. 首先你得有个[博客](http://www.cnblogs.com/)
 4 | 
 5 | 2. 打开 [博客后台管理](https://i.cnblogs.com/Configure.aspx)
 6 | 
 7 | 3. 申请js权限
 8 | 
 9 | 4. 在博客皮肤选项卡中将博客皮肤设置为： [BlueSky](http://www.cnblogs.com/SkinUser.aspx?SkinName=BlueSky)
10 | 
11 | 5. 将 [页面定制.css](https://github.com/Summertime-Wu/make_cnblogs_better/blob/master/%E9%A1%B5%E9%9D%A2%E5%AE%9A%E5%88%B6.css) 复制到 `页面定制CSS代码` 代码框内
12 | 
13 | 6. 将 [页首.html](https://github.com/Summertime-Wu/make_cnblogs_better/blob/master/%E9%A1%B5%E9%A6%96.html) 复制到 `页首Html代码` 代码框内
14 | 
15 | 7. 将 [页尾.html](https://github.com/Summertime-Wu/make_cnblogs_better/blob/master/%E9%A1%B5%E5%B0%BE.html) 复制到 `页脚Html代码` 代码框内
16 | 
17 | 8. 根据自身情况修改页尾.html中的js
18 | 
19 | ```javasript
20 | <script type="text/javascript">
21 |     //博主名称 可不改，默认取博客园提供的
22 |     var nickName =null;
23 |     //slogan
24 |     var slogan = '立德立言，无闻西东';
25 |     //icon
26 |     var icon = "https://ae01.alicdn.com/kf/H445e0280b88f4f34a848238a848a687fw.png";
27 |     //默认博客背景图片
28 |     var defaultPic="https://img2018.cnblogs.com/blog/1138447/201904/1138447-20190426121949417-1115592219.jpg";
29 |     //icon(浏览器标题栏上的)
30 |     var iconB="https://img2018.cnblogs.com/blog/1138447/201909/1138447-20190911161817172-1737762696.png";
31 |     //友情链接地址
32 |     var friendLink="https://www.cnblogs.com/summertime-wu/p/9350833.html";
33 |     //关于地址
34 |     var aboutMe="https://www.cnblogs.com/summertime-wu/p/9350808.html";
35 | </script>
36 | ```
37 | 
38 | 8. 保存，即可食用
39 | 
40 | ## 博客示例
41 | 
42 | ------------------------>>> [夏日浅笑、](https://www.cnblogs.com/summertime-wu/p/9356736.html)
43 | 
44 | 
45 | ## 鸣谢
46 | 
47 | [chakhsu](https://github.com/chakhsu/pinghsu)
48 | 
49 | [gzdaijie](https://github.com/gzdaijie/cnblogs_markdown_optimize)
50 | 


--------------------------------------------------------------------------------
/页尾.html:
--------------------------------------------------------------------------------
  1 | <!-- ............自定义尾部代码开始............ -->
  2 | <div id="post-bottom-bar" class="post-bottom-bar" style="bottom: 0px;">
  3 | 	<div class="bottom-bar-inner">
  4 | 		<!-- 左边 -->
  5 |         <div class="bottom-bar-items social-share" style="float: left;">
  6 |             <span class="bottom-bar-item bottom-bar-facebook">
  7 |                 <a id="bottom-d" href="javascript:void(0)" target="_blank">好文要赞</a>
  8 |             </span>
  9 |             <span class="bottom-bar-item bottom-bar-twitter">
 10 |                 <a id="bottom-g" href="javascript:void(0)" target="_blank">关注我</a>
 11 |             </span>
 12 |             <span class="bottom-bar-item bottom-bar-qrcode">
 13 |                 <a id="bottom-s" href="javascript:void(0)" target="_blank">收藏该文</a>
 14 |             </span>
 15 |         </div>
 16 |         <!-- 右边 -->
 17 |         <div class="bottom-bar-items right" style="float: right;">
 18 |             <span class="bottom-bar-item"><a id="mbottom-left" href="javascript:void(0);">←</a></span>
 19 |             <span class="bottom-bar-item"><a id="mbottom-right" href="javascript:void(0);">→</a></span>
 20 |             <span class="bottom-bar-item"><a href="#mfooter">↓</a></span>
 21 |             <span class="bottom-bar-item"><a href="#mtop">↑</a></span>
 22 |         </div>
 23 | 	</div> 
 24 | </div>
 25 | <a name="mfooter"></a>
 26 | <!-- ............自定义尾部代码结束............ -->
 27 | 
 28 | 
 29 | <script type="text/javascript" src="https://blog-static.cnblogs.com/files/summertime-wu/nprogress.js"></script>
 30 | <script type="text/javascript">
 31 | 
 32 |     //博主名称 可不改，默认取博客园提供的
 33 |     var nickName = null;
 34 |     //slogan
 35 |     var slogan = '立德立言，无闻西东';
 36 |     //icon
 37 |     var icon = "https://ae01.alicdn.com/kf/H445e0280b88f4f34a848238a848a687fw.png";
 38 |     //默认博客背景图片
 39 |     var defaultPic="https://img2018.cnblogs.com/blog/1138447/201904/1138447-20190426121949417-1115592219.jpg";
 40 |     //icon(浏览器标题栏上的)
 41 |     var iconB="https://img2018.cnblogs.com/blog/1138447/201909/1138447-20190911161817172-1737762696.png";
 42 |     //友情链接地址
 43 |     var friendLink="https://www.cnblogs.com/summertime-wu/p/9350833.html";
 44 |     //关于地址
 45 |     var aboutMe="https://www.cnblogs.com/summertime-wu/p/9350808.html";
 46 |     //Github地址,假如博客username与Github username相同，不用改。
 47 |     //如 cnblogs.com/username github.com/username 这样就不用改
 48 |     var myGayhubUrl = null;
 49 | </script>
 50 | <script type="text/javascript">
 51 | 	/**
 52 | 		用来设置初始时需要执行的js
 53 | 	*/
 54 | 	$(document).ready(function(){
 55 | 
 56 |         //获取博主名字
 57 |         if (nickName == null){
 58 |             var footerOverTestArray = $($("#footer")[0].childNodes[2]).text().trim().split(" ");
 59 |             nickName = footerOverTestArray[footerOverTestArray.length - 1];
 60 |         }
 61 | 
 62 | 		//加载顶部进度条
 63 | 	    NProgress.start();
 64 | 	    NProgress.done();
 65 | 	    $("#myProgressBar").hide();
 66 | 
 67 | 	    //设置背景图片地址
 68 | 	    if ($("#head_bg_img").val()!=null && $("#head_bg_img").val()!="") {
 69 | 	    	$("#myheader_bg").css("background-image","url("+$("#head_bg_img").val()+")");
 70 | 	    }else{
 71 |     		$("#myheader_bg").css("background-image","url("+defaultPic+")");
 72 | 	    }
 73 | 
 74 | 	    //设置标题
 75 |         if($("#cb_post_title_url").html()){
 76 |             $("#mypost_title_h").html($("#cb_post_title_url").html());
 77 |         }else{
 78 |             $("#mypost_title_h").html(nickName);
 79 |         }
 80 | 
 81 | 	    //正文和标题淡入
 82 | 	    $("#mainContent").css("opacity","1");
 83 | 	    $("#mainContent").css("margin-top","0");
 84 | 	    $("#mypost_title").css("opacity","1");
 85 | 	    $("#mypost_title").css("top","75pt");
 86 | 
 87 |         /* --根据个人配置修改页面 start-- */
 88 |         //修改a链接
 89 |         var ccList = $(".c-c");
 90 |         for(var cc of ccList){
 91 |             $(cc).attr("href", $(cc).attr("href").replace("summertime-wu",currentBlogApp));
 92 |         }
 93 |         //设置Github链接
 94 |         if (myGayhubUrl != null ){$("#myGayhubUrl").attr("href",myGayhubUrl)}
 95 |         //设置友链的链接
 96 |         $("#friendLink").attr("href",friendLink);
 97 |         //设置关于的链接
 98 |         $("#aboutMe").attr("href",aboutMe);
 99 |         //设置两个iocn图标
100 |         $("#nv-icon").attr("src",icon);
101 |         var linkObject = document.createElement("link");
102 |         linkObject.rel = "shortcut icon";
103 |         linkObject.href = iconB;
104 |         document.getElementsByTagName("head")[0].appendChild(linkObject);
105 |         //设置底部栏按钮
106 |         if (window.location.href == "https://www.cnblogs.com/"+currentBlogApp|| 
107 |                 window.location.href == "https://www.cnblogs.com/"+currentBlogApp+"/"||
108 |                 window.location.href == "http://www.cnblogs.com/"+currentBlogApp|| 
109 |                 window.location.href == "http://www.cnblogs.com/"+currentBlogApp+"/") {
110 |             $("#bottom-d").html("友情链接");
111 |             $("#bottom-d").attr("href",friendLink);
112 |         }else{
113 |             var url = window.location.href;
114 |             var lastUrl = url.substring(url.lastIndexOf("/")+1);
115 |             var mpageId = lastUrl.substring(0,lastUrl.indexOf("."));
116 |             $("#bottom-d").click(function(){
117 |                 DiggIt(mpageId,cb_blogId,1);
118 |                 green_channel_success(this,'谢谢推荐！');
119 |             })
120 |         }
121 |         /* --根据个人配置修改页面 end-- */
122 | 	})
123 | 
124 | 	/**
125 | 		设置ajax请求加载完所有数据时执行的js
126 | 	*/
127 | 	setTimeout(afterAjax,1000);
128 | 	function afterAjax(){
129 | 		//假如是首页
130 | 		if (window.location.href == "https://www.cnblogs.com/"+currentBlogApp|| 
131 | 			window.location.href == "https://www.cnblogs.com/"+currentBlogApp+"/"||
132 | 			window.location.href == "http://www.cnblogs.com/"+currentBlogApp|| 
133 | 			window.location.href == "http://www.cnblogs.com/"+currentBlogApp+"/") {
134 | 			$("#mypost_title_e").html('<a href="https://cnblogs.com/'+currentBlogApp+'">'+slogan+'</a>');
135 | 		}else{
136 | 		    var classification = null;
137 | 		    if ($("#BlogPostCategory").html()!=null && $("#BlogPostCategory").html()!= "") {
138 | 		    	classification = $("#BlogPostCategory").html();
139 | 		    	classification = classification.substring(3,classification.length);
140 | 		    }else{
141 | 		    	classification = '<a href="https://cnblogs.com/'+currentBlogApp+'">暂未分类</a>';
142 | 		    }
143 | 		    var ftitle = 'Published on '+ $("#post-date").html() + ' in ' +  classification
144 | 		    + ' with <a href="https://cnblogs.com/'+currentBlogApp+'">' + nickName + '</a>';
145 | 		    //设置副标题标题
146 | 		    $("#mypost_title_f").html(ftitle);
147 | 		    //设置标题分类按钮
148 | 		    $("#mypost_title_e").html(classification);
149 | 		    //设置底部导航条上一篇下一篇文章
150 | 		    var pnp = $("#post_next_prev a");
151 | 		    $("#mbottom-left").attr("href",pnp[1].href);
152 | 		    if (pnp.length>2) {
153 | 		    	$("#mbottom-right").attr("href",pnp[3].href);
154 | 		    }
155 | 		}
156 | 		$("#myheader_bg").css("filter","blur(0px)");
157 | 
158 |         //优化评论区样式
159 |         $("#comment_form_container p:last").hide();
160 |         $("#commentbox_opt a:last").hide();
161 |         $("#tbCommentBody").attr('placeholder','Your comment here. Be cool. ');
162 | 	}
163 | 
164 | 
165 | 	/** 
166 | 		自定义的js方法
167 | 	*/
168 | 	//设置底部导航条点击关注按钮事件
169 | 	$("#bottom-g").click(function(){
170 | 		$('#green_channel_follow').click()
171 | 		return false
172 | 	})
173 | 	$("#bottom-s").click(function(){
174 | 		AddToWz(cb_entryId);
175 | 		return false;
176 | 	})
177 | 
178 | 
179 | 	//通过滚动条控制导航条的展现隐藏
180 | 	var oldScrollNum = 0;
181 | 	window.onscroll = function(){
182 | 		var t = document.documentElement.scrollTop || document.body.scrollTop;
183 | 		//下滑
184 | 		if (t>oldScrollNum) {
185 | 			if (t>120) {
186 | 				$("#mynavbar").css("margin-top","-70px");//顶部导航
187 | 				$("#post-bottom-bar").css("bottom","-3pc");//底部导航
188 | 			}
189 | 			if (t>300) {
190 | 				$("#right_meun").css("display","inline-block");//右侧导航
191 | 			}
192 | 		//上拉
193 | 		}else{
194 | 			//防止用a链接跳转也触发效果
195 | 			if (oldScrollNum-t<20) {
196 | 				$("#mynavbar").css("margin-top","0px");//顶部导航
197 | 				$("#post-bottom-bar").css("bottom","0");//底部导航
198 | 			}
199 | 			if (t<=300) {
200 | 				$("#right_meun").css("display","none");//右侧导航
201 | 			}
202 | 		}
203 | 		oldScrollNum = t;
204 | 	}
205 | 
206 | 	//背景大图点击模糊||清晰
207 | 	$("#myheader_cover").click(function(){
208 | 		if ($("#myheader_bg").css("filter") == "blur(3px)") {
209 | 			$("#myheader_bg").css("filter","blur(0px)");
210 | 		}else{
211 | 			$("#myheader_bg").css("filter","blur(3px)");
212 | 		}
213 | 	})
214 |  </script>
215 | 
216 |  <script type="text/javascript">  
217 |     var setMyBlog = {
218 |         setCopyright: function() {
219 |             //设置版权信息，转载出处自动根据页面url生成
220 |             var info_str = '<p>作者：<a target="_blank">@gzdaijie</a><br>'+
221 |                 '本文为作者原创，转载请注明出处：<a class="uri"></a></p><hr></hr>', 
222 |                 info = $(info_str),
223 |                 info_a = info.find("a"),
224 |                 url = window.location.href;
225 |             $(info_a[0]).attr("href","https://github.com/gzdaijie");
226 |             $(info_a[1]).attr("href",url).text(url);
227 |             $("#cnblogs_post_body").prepend(info);
228 |         },
229 |         setCodeRow: function(){
230 |             // 代码行号显示
231 |             var pre = $("pre.sourceCode"); //选中需要更改的部分
232 |             if(pre && pre.length){
233 |                 pre.each(function() {
234 |                     var item = $(this);
235 |                     var lang = item.attr("class").split(" ")[1]; //判断高亮的语言
236 |                     item.html(item.html().replace(/<[^>]+>/g,"")); //将<pre>标签中的html标签去掉
237 |                     item.removeClass().addClass("brush: " + lang +";"); //根据语言添加笔刷
238 |                     SyntaxHighlighter.all();
239 |                 })
240 |             }
241 |         },
242 |         setAtarget: function() {
243 |             // 博客内的链接在新窗口打开
244 |             $("#cnblogs_post_body a").each(function(){
245 |                 if (this.href.indexOf(window.location.href === 0)) {
246 |                     // 如果 url 指向当前博客
247 |                     // 不要在新窗口打开
248 |                 } else {
249 |                     this.target = "_blank";
250 |                 }
251 |             }) 
252 |         },
253 |         setContent: function() {
254 |             // 根据h2、h3标签自动生成目录
255 |             var captions_ori = $("#cnblogs_post_body h2"),
256 |             	captions_ori2 = $("#cnblogs_post_body h3"),
257 |                 captions = $("#cnblogs_post_body h2,#cnblogs_post_body h3").clone(),
258 |                 content = $("<ul id='right_meun'></ul>");
259 |             $("#cnblogs_post_body").prepend(content.append(captions));
260 |             var index = -1,index2 = -1;
261 |             captions.replaceWith(function(){
262 |                 var self = this;
263 |                 if(self.tagName == "H2" || self.tagName == "h2"){
264 |                     // 设置点击目录跳转
265 |                     index += 1;
266 |                     $('<a name="' + '_caption_' + index + '"></a>').insertBefore(captions_ori[index]); 
267 |                     return '<li id="'+index+'li"><a href="#_caption_' + index + '">' + self.innerHTML + '</a><ul></ul></li>';
268 |                 } else {
269 |                     // add by summertime-wu 增加h3链接跳转
270 |                     index2 += 1;
271 |                     $('<a name="' + '_caption' + index2 + '"></a>').insertBefore(captions_ori2[index2]); 
272 |                     $("#"+index+"li ul").append('<li><a href="#_caption' + index2 + '" style="color:#5f5f5f;">' +self.innerHTML+"</a></li>");
273 |                     return ;
274 |                 }
275 |             });
276 |         },
277 |         runAll: function() {
278 |             /* 运行所有方法
279 |              * setAtarget() 博客园内标签新窗口打开
280 |              * setContent() 设置目录
281 |              * setCopyright() 设置版权信息
282 |              * setCodeRow() 代码行号显示
283 |              */ 
284 |             this.setAtarget(); 
285 |             //假如为手机端不显示目录
286 |             if(document.body.clientWidth>=1000){
287 |                 this.setContent();
288 |             }
289 |             // this.setCopyright();
290 |             this.setCodeRow();
291 |         }
292 |     }
293 |     setMyBlog.runAll();
294 | </script>
295 | 
296 | <!-- 代码行号 -->
297 | <script src="//cdn.bootcss.com/highlightjs-line-numbers.js/1.1.0/highlightjs-line-numbers.min.js"></script>
298 | <script>hljs.initLineNumbersOnLoad();</script>
299 | 


--------------------------------------------------------------------------------
/页面定制.css:
--------------------------------------------------------------------------------
  1 | 	/**---------- 原有样式修改 --------*/
  2 | 	#sideBar{
  3 | 		display: none;
  4 | 	}
  5 | 	#mainContent{
  6 | 		width: 100%;
  7 | 		box-shadow: 0 0 0;
  8 | 		border-radius: 0px;
  9 | 		opacity: 0;
 10 | 		transition:0.5s;
 11 | 		margin-top:40px;
 12 | 	}
 13 | 	#main{
 14 | 		width: 50%;
 15 | 		background-color: white;
 16 | 		/*max-width: 700px;*/
 17 | 	}
 18 | 	@media screen and (max-width: 1000px) {
 19 | 	 #main {width: 100%;}
 20 | 	}
 21 | 	body{
 22 | 		background-image: none;
 23 | 		background-color: white;
 24 | 		font-family: Menlo,Bitstream Vera Sans Mono,DejaVu Sans Mono,Monaco,Consolas,monospace !important;
 25 | 		line-height: 1.8;
 26 | 	}
 27 | 	#cnblogs_post_body{
 28 | 		font-size: 16px;
 29 | 	}
 30 | 	#green_channel{
 31 | 		display: none;
 32 | 	}
 33 | 	#post_next_prev{
 34 | 		display: none;
 35 | 	}
 36 | 	.forFlow img{
 37 | 		margin-top: 0;
 38 | 	}
 39 | 	#cnblogs_post_body img {
 40 | 	    max-width: 100%;
 41 | 	}
 42 | 
 43 | 	/** 去除广告 */
 44 | 	#cb_post_title_url{
 45 | 		display: none;
 46 | 	}
 47 | 	#cnblogs_c1{
 48 | 		display: none;
 49 | 	}
 50 | 	#cnblogs_c2{
 51 | 		display: none;
 52 | 	}
 53 | 	#ad_t2{
 54 | 		display: none;
 55 | 	}
 56 | 	#kb_block{
 57 |     	display:none
 58 | 	}
 59 | 	#under_post_news{
 60 | 	    display:none
 61 | 	}
 62 | 	#header{
 63 | 		display:none
 64 | 	}
 65 | 	#BlogPostCategory{
 66 | 		display: none;
 67 | 	}
 68 | 	#comment_nav{
 69 | 		display: none;
 70 | 	}
 71 | 	.postDesc{
 72 | 		border-bottom:none;
 73 | 	}
 74 | 	#author_profile_follow{
 75 | 		display: none;
 76 | 	}
 77 | 
 78 | 	/** 自定义样式 */
 79 | 	/* 加载条 */
 80 | 	#myProgressBar{
 81 | 		width: 15%;
 82 | 		height: 2px;
 83 | 		background-color: #eb5055;
 84 | 		position: fixed;
 85 | 		top: 0;
 86 | 		left: 0;
 87 | 		z-index: 999;
 88 | 	}
 89 | 	#nprogress {
 90 | 	  pointer-events: none;
 91 | 	}
 92 | 
 93 | 	#nprogress .bar {
 94 | 	  background: #eb5055;
 95 | 
 96 | 	  position: fixed;
 97 | 	  z-index: 1031;
 98 | 	  top: 0;
 99 | 	  left: 0;
100 | 
101 | 	  width: 100%;
102 | 	  height: 2px;
103 | 	}
104 | 	#nprogress .peg {
105 | 	  display: block;
106 | 	  position: absolute;
107 | 	  right: 0px;
108 | 	  width: 100px;
109 | 	  height: 100%;
110 | 	  box-shadow: 0 0 10px #eb5055, 0 0 5px #eb5055;
111 | 	  opacity: 1.0;
112 | 
113 | 	  -webkit-transform: rotate(3deg) translate(0px, -4px);
114 | 	      -ms-transform: rotate(3deg) translate(0px, -4px);
115 | 	          transform: rotate(3deg) translate(0px, -4px);
116 | 	}
117 | 	#nprogress .spinner {
118 | 	  display: block;
119 | 	  position: fixed;
120 | 	  z-index: 1031;
121 | 	  top: 15px;
122 | 	  right: 15px;
123 | 	}
124 | 
125 | 	#nprogress .spinner-icon {
126 | 	  width: 18px;
127 | 	  height: 18px;
128 | 	  box-sizing: border-box;
129 | 
130 | 	  border: solid 2px transparent;
131 | 	  border-top-color: #eb5055;
132 | 	  border-left-color: #eb5055;
133 | 	  border-radius: 50%;
134 | 
135 | 	  -webkit-animation: nprogress-spinner 400ms linear infinite;
136 | 	          animation: nprogress-spinner 400ms linear infinite;
137 | 	}
138 | 	.nprogress-custom-parent {
139 | 	  overflow: hidden;
140 | 	  position: relative;
141 | 	}
142 | 	.nprogress-custom-parent #nprogress .spinner,
143 | 	.nprogress-custom-parent #nprogress .bar {
144 | 	  position: absolute;
145 | 	}
146 | 
147 | 	@-webkit-keyframes nprogress-spinner {
148 | 	  0%   { -webkit-transform: rotate(0deg); }
149 | 	  100% { -webkit-transform: rotate(360deg); }
150 | 	}
151 | 	@keyframes nprogress-spinner {
152 | 	  0%   { transform: rotate(0deg); }
153 | 	  100% { transform: rotate(360deg); }
154 | 	}
155 | 
156 | 
157 | 	/** 导航栏 */
158 | 	#mynavbar{
159 | 		width: 100%;
160 | 		height: 70px;
161 | 		position: fixed;
162 | 		display: block;
163 | 		top: 0px;
164 | 		z-index: 100;
165 | 		background-color: white;
166 | 		transition:0.5s ease-in-out;
167 | 		box-shadow: 0 1px 5px rgba(0,0,0,.1);
168 | 	}
169 | 	#mynavbar_menu{
170 | 	    display: inline-block;
171 | 	    width: auto;
172 | 	    position: relative;
173 | 	    float: right;
174 |         text-align: right;
175 |     	line-height: 68px;
176 | 	}
177 | 	#mynavbar_menu a{
178 | 	    padding: 0 15px;
179 | 	    font-size: 14px;
180 | 	    outline: 0;
181 | 	    color: #313131;
182 | 	    text-decoration: none;
183 | 	}
184 | 	#mynavbar_menu a:hover{
185 | 		color: #eb5055 !important;
186 | 	}
187 | 
188 | 	/** 头部 */
189 | 	#myheader{
190 | 		background-color: #2175bc!important;
191 | 		margin-top:70px;
192 | 		position: relative;
193 | 	    width: 100%;
194 |     	height: 300px;
195 | 	}
196 | 	#myheader_bg{
197 | 		width:100%;
198 | 		height:300px;
199 | 		background-position: center;
200 | 	    background-size: cover;
201 | 	    -webkit-filter: blur(3px);
202 | 	    -moz-filter: blur(3px);
203 | 	    filter: blur(3px);
204 | 	    position: absolute;
205 | 	}
206 | 	#myheader_cover{
207 | 	    position: relative;
208 | 	    margin-top: 70px;
209 | 	    width: 100%;
210 | 	    height: 300px;
211 | 	    background-color: rgba(0,0,0,.5);
212 | 	    box-shadow: 0 1px 5px rgba(0,0,0,.3);
213 | 	}
214 | 	#mypost_title{
215 | 	    position: relative;
216 | 	    top: 105pt;
217 | 	    margin: 0 auto;
218 | 	    padding: 30px 25px 20px;
219 | 	    max-width: 700px;
220 | 	    color: white;
221 | 	    transition:0.5s;
222 | 	    opacity: 0;
223 | 	}
224 | 	#mypost_title_e{
225 | 		margin: 0;
226 |     	padding: 5px 0 15px;
227 | 	}
228 | 	#mypost_title_e a{
229 | 		border: 1px solid #6fa3ef;
230 | 	    border-radius: 15px;
231 | 	    background: #6fa3ef;
232 | 	    color: #fff;display: inline-block;
233 | 	    margin: 4px 8px 0 0;
234 | 	    padding: 0 15px;
235 | 	    letter-spacing: 0;
236 | 	    font-weight: 600;
237 | 	    font-size: 13px;outline: 0;text-decoration: none;
238 | 	    transition: 0.5s;
239 | 	}
240 | 	#mypost_title_e a:before{
241 | 		content: "# "
242 | 	}
243 | 	#mypost_title_e a:hover{
244 | 		background-color: white;
245 | 		border: 1px solid white;
246 | 		color:black;
247 | 	}
248 | 	#mypost_title_f a{
249 | 		color: white;
250 | 	}
251 | 	#mypost_title_f a:hover{
252 | 		text-decoration:none;
253 | 	}
254 | 
255 | 	/** 右侧导航 */
256 | 	#right_meun{
257 | 	    position: fixed;
258 | 	    top: 100px;
259 | 	    left: 74%;
260 | 	    display: none;
261 | 	    text-align: left;
262 | 	    border-left: 1px solid #ddd;
263 | 	    font-size: 12px;
264 | 	}
265 | 	#right_meun li{
266 | 		list-style: none!important;
267 | 	}
268 | 	#right_meun a{
269 | 		display: inline-table;
270 | 	    margin-left: 5px;
271 | 	    white-space: nowrap;
272 | 	    text-decoration: none;
273 | 	    color: #313131;
274 | 	    outline: 0;
275 | 	}
276 | 	#right_meun a:hover{
277 | 		color: #eb5055;
278 | 	}
279 | 	#right_meun>li::before {
280 | 	    position: relative;
281 | 	    top: 0;
282 | 	    left: -4px;
283 | 	    display: inline-block;
284 | 	    width: 7px;
285 | 	    height: 7px;
286 | 	    content: '';
287 | 	    border-radius: 50%;
288 | 	    background-color: #eb5055;
289 | 	}
290 | 	/* 底部导航 */
291 | 	#post-bottom-bar{
292 | 		position: fixed;
293 | 	    right: 0;
294 | 	    bottom: 0;
295 | 	    left: 0;
296 | 	    z-index: 2;
297 | 	    height: 3pc;
298 | 	    border-top: 1px solid #e0e0e0;
299 | 	    background-color: #fff;
300 | 	    margin: 0;
301 | 	    padding: 0;
302 | 	    transition: 0.5s ease-in-out;
303 | 	}
304 | 	#post-bottom-bar a{
305 | 	    text-decoration: none!important;
306 | 	}
307 | 	.post-bottom-bar .bottom-bar-inner{
308 | 		margin: 0 auto;
309 | 	    padding: 0 10px;
310 | 	    max-width: 900px;
311 | 	}
312 | 	.bottom-bar-items{
313 | 		margin: 0 0 0 10px;
314 | 	    color: #313131;
315 | 	    font-size: 14px !important;
316 | 	    line-height: 3pc;float: left;
317 | 	}
318 | 	.post-bottom-bar{
319 | 		margin: 0 0 0 10px;
320 | 	    color: #313131;
321 | 	    font-size: 14px;
322 | 	    line-height: 3pc;
323 | 	}
324 | 	.post-bottom-bar .social-share .bottom-bar-item {
325 | 	    padding: 4px;
326 | 	}
327 | 	.post-bottom-bar .bottom-bar-item.bottom-bar-facebook a {
328 | 	    background-color: #4267b2;
329 | 	    color: #fff;
330 | 	}
331 | 	.post-bottom-bar .social-share .bottom-bar-item a {
332 | 	    padding: 2px 10px;
333 | 	    border-radius: 15px;
334 | 	}
335 | 	.post-bottom-bar .bottom-bar-item a {
336 | 	    margin: 0;
337 | 	    padding: 9pt;
338 | 	    border: 0;
339 | 	    background: 0 0;
340 | 	    color: #313131;
341 | 	    font-size: 14px;
342 | 	    line-height: 3pc;
343 | 	    cursor: pointer;
344 | 	}
345 | 	.post-bottom-bar .bottom-bar-item.bottom-bar-twitter a {
346 | 	    background-color: #1b95e0;
347 | 	    color: #fff;
348 | 	}
349 | 	.post-bottom-bar .bottom-bar-item.bottom-bar-qrcode a {
350 | 	    background-color: #5f5f5f;
351 | 	    color: #fff;
352 | 	}
353 | 	.bottom-bar-item a:hover{
354 | 		color: #eb5055;
355 | 	}
356 | 
357 | 
358 | 	/** MarkDown样式调整 */
359 | 	.cnblogs-markdown .hljs{
360 | 	    font-size: 16px!important;
361 | 	    line-height: 2!important;
362 | 	    padding: 15px!important;
363 | 	}
364 | 	.cnblogs-markdown code{
365 | 		background:rgb(238,240,244) none !important;
366 | 		border:0px !important;
367 | 		color: rgb(73,59,92) !important;
368 | 		font-size: 16px!important;
369 | 		tab-size: 4;
370 | 	}
371 | 	.cnblogs-markdown h2{
372 | 		font-weight: 500;
373 | 		margin: 20px 0;
374 | 	}
375 | 	.cnblogs-markdown h2:before{
376 | 		content: "#";
377 | 		color: #eb5055;
378 | 		position: relative;
379 | 		top: 0;
380 | 		left: -12px;
381 | 	}
382 | 	#cnblogs_post_body h2{
383 | 		font-weight: 500;
384 | 		margin: 20px 0;
385 | 	}
386 | 	#cnblogs_post_body h3{
387 | 		font-size: 16px;
388 | 	    font-weight: bold;
389 | 	    line-height: 1.5;
390 | 	    margin: 10px 0;
391 | 	}
392 | 	.cnblogs-markdown h3:before{
393 | 		content: "##";
394 | 		color: #2175bc;
395 | 		position: relative;
396 | 		top: 0;
397 | 		left: -8px;
398 | 	}
399 | 	.postBody blockquote, .postCon blockquote{
400 | 		background-image: none;
401 | 		border-left: 5px solid #DDDFE4;
402 | 		background-color: #EEF0F4;
403 | 		width: 100%;
404 | 		padding: 6px 0 6px 25px;
405 | 	}
406 | 	blockquote{
407 | 		border:0;
408 | 	}
409 | 	/* code加上行数 */
410 | 	.cnblogs-markdown .syntaxhighlighter table td.code {
411 | 	  width:95% !important; 
412 | 	}
413 | 
414 | 	.cnblogs-markdown .syntaxhighlighter code {
415 | 	  font-family: "Consolas","Bitstream Vera Sans Mono","Courier New",Courier,monospace!important;
416 | 	  padding: 0 !important;
417 | 	  border-radius: 0 !important;
418 | 	  background-color: transparent !important;
419 | 	}
420 | 
421 | 	.cnblogs-markdown .syntaxhighlighter code:before,
422 | 	.cnblogs-markdown .syntaxhighlighter code:before {
423 | 	  letter-spacing: -0.5em;
424 | 	}
425 | 	.cnblogs-markdown em{
426 | 		font-style:italic
427 | 	}
428 | 
429 | 
430 | 	/** 更改浏览器滚动条和选中字体背景颜色 */
431 | 	::selection {
432 | 	    background-color: #eb5055;
433 | 	    color: #fff;
434 | 	}
435 | 	::-webkit-scrollbar {
436 | 	    width: 6px;
437 | 	    height: 6px;
438 | 	}
439 | 	::-webkit-scrollbar-thumb {
440 | 	    min-height: 28px;
441 | 	    background-color: #c2c2c2;
442 | 	    background-clip: padding-box;
443 | 	}
444 | 	::-webkit-scrollbar-track-piece {
445 | 	    background-color: #fff;
446 | 	}
447 | 	*, :after, :before {
448 | 	    box-sizing: border-box;
449 | 	}
450 | 
451 | 
452 | 	/** 首页文章条显示优化 */
453 | 	.day{
454 | 	    border-radius: 10px;
455 | 	    box-shadow: 0 0 20px 2px rgba(0,0,0,.1);
456 | 	    margin-top: 40px;
457 | 	    transition: 0.3s;
458 | 	}
459 | 	.day:hover{
460 | 		box-shadow: 0 1px 2px rgba(0,0,0,.1);
461 | 	}
462 | 	.dayTitle {
463 | 		display: none;
464 | 	}
465 | 
466 | 
467 | 	/** 优化评论区样式 */
468 | 	.feedbackItem{
469 | 		background-color: ghostwhite;
470 | 	    border-radius: 10px;
471 | 	    padding: 20px;
472 | 	    margin-top: 20px;
473 | 	    border: 0px;
474 | 	}
475 | 	.comment_textarea{
476 | 	    padding: 15px;
477 |         border-radius: 10px;
478 | 	    outline: 0;
479 | 	    resize: none;
480 | 	    overflow: hidden;
481 | 		width: 100%;
482 | 	}
483 | 	.comment_btn {
484 | 	    border: 1px solid #f7f7f7;
485 | 	    border-radius: 30px;
486 | 	    background-color: #f7f7f7;
487 | 	    font-size: 13px;
488 | 	    cursor: pointer;
489 | 	    height: 32px;
490 | 	    padding: 0 20px;
491 | 	    position: absolute;
492 | 	    right:3.5%;
493 | 	    width: auto;
494 | 	}
495 | 	.comment_btn:hover {
496 | 	    border: 1px solid #eb5055;
497 | 	    background-color: white;
498 | 	    color: #eb5055;
499 | 	    transition-duration: .4s;
500 | 	}
501 | 	.feedback_area_title{
502 | 		display: none;
503 | 	}
504 | 	.commentbox_main{
505 | 	    margin-top: 20px;
506 | 	}
507 | 


--------------------------------------------------------------------------------
/页首.html:
--------------------------------------------------------------------------------
 1 | <!-- ............自定义首部代码开始............ -->
 2 | <!-- 自定义进度条 -->
 3 | <div id="myProgressBar" style="display: none;"></div>
 4 | 
 5 | <!-- 自定义导航条 -->
 6 | <div id="mynavbar" style="margin-top: 0px;">
 7 |     <div style="position:relative;width:65pc;height:70px;margin:0 auto;">
 8 |     	<a style="width: auto;height: 22px;margin-left: 25px;" class="c-c"  href="https://www.cnblogs.com/summertime-wu">
 9 |     		<img id="nv-icon" style="width: auto;height: 22px;outline: 0;margin-top: 25px;">
10 |     	</a>
11 |     	<div id="mynavbar_menu">
12 | 	    	<a href="https://www.cnblogs.com/summertime-wu" class="c-c">首页</a>
13 | 	    	<a href="https://msg.cnblogs.com/send/summertime-wu" class="c-c">联系</a>
14 | 	    	<a id="myGayhubUrl" href="https://github.com/Summertime-Wu" class="c-c">Github</a>
15 | 	    	<a id="friendLink" href="#">友情链接</a>
16 | 	    	<a href="https://www.cnblogs.com/">博客园</a>
17 |             <a href="https://i.cnblogs.com/posts">管理</a>
18 | 	    	<a id="aboutMe" href="#">关于</a>
19 | 	    </div>
20 |     </div>
21 | </div>
22 | 
23 | <!-- 自定义头部锚点 -->
24 | <a name="mtop"></a>
25 | 
26 | <!-- 自定义头部 -->
27 | <div id="myheader">
28 | 	<!-- 背景图片 -->
29 |     <div id="myheader_bg"></div>
30 |     <!-- 遮罩层 -->
31 |     <div id="myheader_cover" title="点我点我">
32 |         <!-- 博客标题 -->
33 |         <div id="mypost_title">
34 |             <div id="mypost_title_h" style="font-weight: 500;font-size: 21px;"></div>
35 |             <div id="mypost_title_f"></div>
36 |             <div id="mypost_title_e">
37 |                 <a href="https://www.cnblogs.com/" class="c-c" style="">暂未分类</a>
38 |             </div> 
39 |         </div>  
40 |     </div>
41 | </div>
42 | <!-- ............自定义首部代码结束............ -->
43 | 


--------------------------------------------------------------------------------