【学习工具】博客园主题

目录

• 博客园主题

正文

回到顶部

博客园主题

博客侧边栏公告：

<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> </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>

页面定制CSS代码：

/*标题h1 h2 h3样式*/
#cnblogs_post_body {
    color: black;
    font: 0.875em/1.5em"微软雅黑", "PTSans", "Arial", sans-serif;
    font-size: 14px;
}

/*标题2*/
#cnblogs_post_body h2 {
    color: #ffffff;
    padding-left: 15px;
    background-color: #00BFFF !important;
    text-shadow: 2px 2px 3px #222222;
    font-family: "微软雅黑" , "宋体" , "黑体" ,Arial;
    margin-bottom: 5px;
}
/*标题3*/
#cnblogs_post_body h3 {
    font-size: 16pt;
    color: white;
    background-color: #00BFFF;
    border-left: red 10px solid;
    padding-left: 16px;
    margin-top: 20px;
}



body {
color: #000;
background: url("http://images.cnblogs.com/cnblogs_com/sunbines/1216966/o_459873-20150919175458742-1697781612.jpg") fixed;
background-size: cover;
background-repeat: no-repeat;
font-family: "Helvetica Neue",Helvetica,Verdana,Arial,sans-serif;
font-size: 12px;
min-height: 100%;
}





body
{
   text-align:center;
}
#home
{
   margin: 0px auto;
   text-align:left;
   max-width:1500px;
}





.catListTitle {
font-weight: bold;
line-height: 1.2;
margin-top: 21px;
margin-bottom: 10.5px;
border-left:10px solid #008000;
padding: 10px 0 10px 14px;
text-align: left;
font-family: 微软雅黑;
}
#profile_block {
font-family: 微软雅黑;
}
#navigator {
font-family: 微软雅黑;
}
*{
font-family: 微软雅黑;
}







/* 个性签名 */
#MySignature {
    box-shadow: 8px 1px 10px #989898;
    padding: 10px;
    text-shadow: 1px 1px 1px #FFF;
    font-size: 15px;
    border-left: solid 5px #55895B;
    background: #F3F3F3;
    border-radius: 10px 10px 50% 10px;
    line-height: 2.4;
    margin: 40px 0;
}

#MySignature a {
    text-decoration: none;
    color: #4183c4;
    font-weight: bold;
}

#MySignature a:hover {
    text-decoration: underline;
    color: #f60;
}

#MySignature span {
    color: #f60;
}

页脚HTML代码：

<style>
#back-top {
     position: fixed;
     bottom: 10px;
     right: 5px;
     z-index: 99;
}
#back-top span {
     width: 50px;
     height: 64px;
     display: block;
     background:url(http://images.cnblogs.com/cnblogs_com/seanshao/855033/o_rocket.png) no-repeat center center;
}
#back-top a{outline:none}
</style>
<script type="text/javascript">
$(function() {
    // hide #back-top first
    $("#back-top").hide();
    // fade in #back-top
    $(window).scroll(function() {
        if ($(this).scrollTop() > 500) {
            $('#back-top').fadeIn();
        } else {
            $('#back-top').fadeOut();
        }
    });
    // scroll body to 0px on click
    $('#back-top a').click(function() {
        $('body,html').animate({
            scrollTop: 0
        }, 800);
        return false;
    });
});
</script>
<p id="back-top" style="display:none"><a href="#top"><span></span></a></p>