主题
页面定制CSS代码
1 /*标题h1 h2 h3样式*/ 2 #cnblogs_post_body { 3 color: black; 4 font: 0.875em/1.5em"微软雅黑", "PTSans", "Arial", sans-serif; 5 font-size: 14px; 6 } 7 8 /*标题2*/ 9 #cnblogs_post_body h2 { 10 color: #ffffff; 11 padding-left: 15px; 12 background-color: #00BFFF !important; 13 text-shadow: 2px 2px 3px #222222; 14 font-family: "微软雅黑" , "宋体" , "黑体" ,Arial; 15 margin-bottom: 5px; 16 } 17 /*标题3*/ 18 #cnblogs_post_body h3 { 19 font-size: 16pt; 20 color: white; 21 background-color: #00BFFF; 22 border-left: red 10px solid; 23 padding-left: 16px; 24 margin-top: 20px; 25 } 26 27 28 29 30 31 body { 32 color: #000; 33 background: url("https://www.cnblogs.com/images/cnblogs_com/sunbines/1216966/o_1554478624239.jpg") fixed; 34 background-size: cover; 35 background-repeat: no-repeat; 36 font-family: "Helvetica Neue",Helvetica,Verdana,Arial,sans-serif; 37 font-size: 12px; 38 min-height: 100%; 39 } 40 41 42 43 44 45 body 46 { 47 text-align:center; 48 } 49 #home 50 { 51 margin: 0px auto; 52 text-align:left; 53 max-width:1200px; 54 } 55 56 57 58 59 60 .catListTitle { 61 font-weight: bold; 62 line-height: 1.2; 63 margin-top: 21px; 64 margin-bottom: 10.5px; 65 border-left:10px solid #008000; 66 padding: 10px 0 10px 14px; 67 text-align: left; 68 font-family: 微软雅黑; 69 } 70 #profile_block { 71 font-family: 微软雅黑; 72 } 73 #navigator { 74 font-family: 微软雅黑; 75 } 76 *{ 77 font-family: 微软雅黑; 78 } 79 80 81 82 83 84 85 86 /* 个性签名 */ 87 #MySignature { 88 box-shadow: 8px 1px 10px #989898; 89 padding: 10px; 90 text-shadow: 1px 1px 1px #FFF; 91 font-size: 15px; 92 border-left: solid 5px #55895B; 93 background: #F3F3F3; 94 border-radius: 10px 10px 50% 10px; 95 line-height: 2.4; 96 margin: 40px 0; 97 } 98 99 #MySignature a { 100 text-decoration: none; 101 color: #4183c4; 102 font-weight: bold; 103 } 104 105 #MySignature a:hover { 106 text-decoration: underline; 107 color: #f60; 108 } 109 110 #MySignature span { 111 color: #f60; 112 } 113 114 /*引用框*/ 115 blockquote { 116 background: none; 117 border: 2px solid #ffffff4d; 118 border-left-color: rgba(255, 255, 255, 0.3); 119 border-left-style: solid; 120 border-left-width: 2px; 121 padding-left: 10px; 122 padding-right: 10px; 123 padding-top: 5px; 124 padding-bottom: 5px; 125 margin-top: 10px; 126 margin-bottom: 10px; 127 border-left: 3px solid #21759b; 128 border-left-color: rgb(33, 117, 155); 129 border-left-style: solid; 130 border-left-width: 3px; 131 }
博客侧边栏公告(支持HTML代码)(支持JS代码)
1 <script language="javascript" type="text/javascript"> 2 3 // 生成目录索引列表 4 // ref: http://www.cnblogs.com/wangqiguo/p/4355032.html 5 // modified by: zzq 6 function GenerateContentList() 7 { 8 var mainContent = $('#cnblogs_post_body'); 9 var h2_list = $('#cnblogs_post_body h2');//如果你的章节标题不是h2,只需要将这里的h2换掉即可 10 11 if(mainContent.length < 1) 12 return; 13 14 if(h2_list.length>0) 15 { 16 var content = '<a name="_labelTop"></a>'; 17 content += '<div id="navCategory">'; 18 content += '<p style="font-size:18px"><b>目录</b></p>'; 19 content += '<ul>'; 20 for(var i=0; i<h2_list.length; i++) 21 { 22 var go_to_top = '<div style="text-align: right"><a href="#_labelTop">回到顶部</a><a name="_label' + i + '"></a></div>'; 23 $(h2_list[i]).before(go_to_top); 24 25 var h3_list = $(h2_list[i]).nextAll("h3"); 26 var li3_content = ''; 27 for(var j=0; j<h3_list.length; j++) 28 { 29 var tmp = $(h3_list[j]).prevAll('h2').first(); 30 if(!tmp.is(h2_list[i])) 31 break; 32 var li3_anchor = '<a name="_label' + i + '_' + j + '"></a>'; 33 $(h3_list[j]).before(li3_anchor); 34 li3_content += '<li><a href="#_label' + i + '_' + j + '">' + $(h3_list[j]).text() + '</a></li>'; 35 } 36 37 var li2_content = ''; 38 if(li3_content.length > 0) 39 li2_content = '<li><a href="#_label' + i + '">' + $(h2_list[i]).text() + '</a><ul>' + li3_content + '</ul></li>'; 40 else 41 li2_content = '<li><a href="#_label' + i + '">' + $(h2_list[i]).text() + '</a></li>'; 42 content += li2_content; 43 } 44 content += '</ul>'; 45 content += '</div><p> </p>'; 46 content += '<p style="font-size:18px"><b>正文</b></p>'; 47 if($('#cnblogs_post_body').length != 0 ) 48 { 49 $($('#cnblogs_post_body')[0]).prepend(content); 50 } 51 } 52 53 var qqinfo = '<p style="color:navy;font-size:12px"></p>'; 54 $(mainContent[0]).prepend(qqinfo); 55 } 56 57 GenerateContentList(); 58 </script>
页首Html代码
<script src="http://cdn.bootcss.com/bootstrap/3.2.0/js/bootstrap.min.js"></script> <link href="https://files.cnblogs.com/files/ning-wang/marvin.nav.css" rel="stylesheet"> <script type="text/javascript" src="https://files.cnblogs.com/files/ning-wang/marvin.nav.js"></script>
页脚Html代码
1 <style> 2 #back-top { 3 position: fixed; 4 bottom: 10px; 5 right: 5px; 6 z-index: 99; 7 } 8 #back-top span { 9 width: 50px; 10 height: 64px; 11 display: block; 12 background:url(http://images.cnblogs.com/cnblogs_com/seanshao/855033/o_rocket.png) no-repeat center center; 13 } 14 #back-top a{outline:none} 15 </style> 16 <script type="text/javascript"> 17 $(function() { 18 // hide #back-top first 19 $("#back-top").hide(); 20 // fade in #back-top 21 $(window).scroll(function() { 22 if ($(this).scrollTop() > 500) { 23 $('#back-top').fadeIn(); 24 } else { 25 $('#back-top').fadeOut(); 26 } 27 }); 28 // scroll body to 0px on click 29 $('#back-top a').click(function() { 30 $('body,html').animate({ 31 scrollTop: 0 32 }, 800); 33 return false; 34 }); 35 }); 36 </script> 37 <p id="back-top" style="display:none"><a href="#top"><span></span></a></p>