1. 程式人生 > >博客園主題

博客園主題

ng- under neu cor size red right 樣式 val

頁面定制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("http://images.cnblogs.com/cnblogs_com/sunbines/1216966/o_459873-20150919175458742-1697781612.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:1220px; 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 }

博客側邊欄公告(支持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>&nbsp;</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代碼)(支持JS代碼)

<script language="javascript" type="text/javascript">

// 生成目錄索引列表
// ref: http://www.cnblogs.com/wangqiguo/p/4355032.html
// modified by: zzq
function GenerateContentList()
{
    var mainContent = $(#cnblogs_post_body);
    var h2_list = $(#cnblogs_post_body h2);//如果你的章節標題不是h2,只需要將這裏的h2換掉即可

    if(mainContent.length < 1)
        return;
 
    if(h2_list.length>0)
    {
        var content = <a name="_labelTop"></a>;
        content += <div id="navCategory">;
        content += <p style="font-size:18px"><b>目錄</b></p>;
        content += <ul>;
        for(var i=0; i<h2_list.length; i++)
        {
            var go_to_top = <div style="text-align: right"><a href="#_labelTop">回到頂部</a><a name="_label + i + "></a></div>;
            $(h2_list[i]).before(go_to_top);
            
            var h3_list = $(h2_list[i]).nextAll("h3");
            var li3_content = ‘‘;
            for(var j=0; j<h3_list.length; j++)
            {
                var tmp = $(h3_list[j]).prevAll(h2).first();
                if(!tmp.is(h2_list[i]))
                    break;
                var li3_anchor = <a name="_label + i + _ + j + "></a>;
                $(h3_list[j]).before(li3_anchor);
                li3_content += <li><a href="#_label + i + _ + j + "> + $(h3_list[j]).text() + </a></li>;
            }
            
            var li2_content = ‘‘;
            if(li3_content.length > 0)
                li2_content = <li><a href="#_label + i + "> + $(h2_list[i]).text() + </a><ul> + li3_content + </ul></li>;
            else
                li2_content = <li><a href="#_label + i + "> + $(h2_list[i]).text() + </a></li>;
            content += li2_content;
        }
        content += </ul>;
        content += </div><p>&nbsp;</p>;
        content += <p style="font-size:18px"><b>正文</b></p>;
        if($(#cnblogs_post_body).length != 0 )
        {
            $($(#cnblogs_post_body)[0]).prepend(content);
        }
    }   

    var qqinfo =  <p style="color:navy;font-size:12px"></p>;
    $(mainContent[0]).prepend(qqinfo);
}

GenerateContentList();
</script>

頁首Html代碼

<script src="http://cdn.bootcss.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>   
<link href="http://files.cnblogs.com/files/ning-wang/marvin.nav.css" rel="stylesheet">
<script type="text/javascript" src="http://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>

博客園主題