• 博客园怎么设置页脚、版权


    设置博客园样式

    设置样式需要先申请js权限,如果要添加版权信息还需要添加版权模板,最下面三个是我博客的js代码。

     申请JS权限

     添加版权设置

    <div>
      作者:
      <a href="https://home.cnblogs.com/u/dc-earl/" target="_blank">i孤独行者</a>
    </div>
    <div>
      出处:
      <a href="https://home.cnblogs.com/u/dc-earl/" target="_blank">https://home.cnblogs.com/u/dc-earl/</a>
    </div>
    <div>本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。 </div>
    版权代码如下

     添加页面定制CSS代码、页首Html代码、页脚Html代码

    #MySignature{  
     border:solid 1px #E5E5E5;
     padding:10px;
     background:#E5EEF7 url(http://images.cnblogs.com/cnblogs_com/grenet/226272/o_o_o_info.png) no-repeat scroll 15px 50%;
     padding-left:80px;}
    
    #MySignature div{
      line-height: 20px;
    }
    #topics .postTitle a {
        color: #390;
        transition: all 0.4s linear 0s;
    }
    <style type="text/css">
    
        #cnblogs_post_body
        {
            color: black;
            font: 0.875em/1.5em "微软雅黑" , "PTSans" , "Arial" ,sans-serif;
            font-size: 16px;
        }
        #cnblogs_post_body h2    {
                background: #308ebb;
        border-radius: 6px 6px 6px 6px;
        box-shadow: 0 0 0 1px #169fe6, 1px 1px 1px 1px #2fb4dc;
        color: #FFFFFF;
        font-family: "微软雅黑" , "宋体" , "黑体" ,Arial;
        font-size: 18px;
        font-weight: bold;
        height: 25px;
        line-height: 25px;
        margin: 18px 0 !important;
        padding: 8px 0 5px 5px;
        text-shadow: 2px 2px 3px #222222;
        }
     #cnblogs_post_body h3{
        background: #169fe6;
        border-radius: 6px 6px 6px 6px;
        box-shadow: 0 0 0 1px #169fe6, 1px 1px 1px 1px #2fb4dc;
        color: #FFFFFF;
        font-family: "微软雅黑" , "宋体" , "黑体" ,Arial;
        font-size: 18px;
        font-weight: bold;
        height: 25px;
        line-height: 25px;
        margin: 18px 0 !important;
        padding: 8px 0 5px 5px;
        text-shadow: 2px 2px 3px #222222;
        }
     #cnblogs_post_body a {
            color: #21759b;
        transition-delay: 0s;
        transition-duration: 0.4s;
        transition-property: all;
        transition-timing-function: linear;
        }
    #cnblogs_post_body a:hover{
        margin-left: 20px
    }
    
    #navCategory  a{
        display: block;
        transition:all 1s;
    }
    #navCategory a:hover{
        margin-left: 20px
    }
    
    #blog-sidecolumn  a{
        display: block;
        transition:all 1s;
    }
    #blog-sidecolumn a:hover{
        margin-left: 20px
    }
    
    #sidebar_toptags li a{
    float:left;
    }
    #TopViewPostsBlock li a{
    margin-left: 5px;
    }
    #cnblogs_post_body a{
        display: block;
        transition:all 1s;
    }
    </style>
    页面定制CSS代码
    <script src="http://cdn.bootcss.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
    <link href="https://files.cnblogs.com/files/wudongwei/markdown.css" rel="stylesheet">
    <link href="https://files.cnblogs.com/files/wudongwei/bigmulu.css" rel="stylesheet">
    <script type="text/javascript" src="https://files.cnblogs.com/files/wudongwei/mulu.js"></script>
    页首Html代码
    <script language="javascript" type="text/javascript">
    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" style="color: #390;transition: all 0.4s linear 0s;"></a>';
            content += '<div id="navCategory" style="color:#152e97;">';
    
            content += '<hr />';
            content += '<h1 style="font-size:16px;font-size: 17px;color: #000000;font-weight: bold; padding-left:5px;"><b>目录:</b></h1>';
            content += '<ol>';
            for(var i=0; i<h2_list.length; i++)
            {
                var go_to_top = '<div style="text-align: right;"><a href="#_labelTop" style="color:#f68a33">回到顶部</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 + '"style="font-size:12px;color:#2b6695;">' + $(h3_list[j]).text() + '</a></li>';
                }
    
                var li2_content = '';
                if(li3_content.length > 0)
                    li2_content = '<li><a href="#_label' + i + '"style="font-size:12px;color:#2b6695;padding-left:-5px;">' + $(h2_list[i]).text() + '</a><ul style="margin-left: 3px;">' + li3_content + '</ul></li>';
                else
                    li2_content = '<li><a href="#_label' + i + '">' + $(h2_list[i]).text() + '</a></li>';
                content += li2_content;
            }
            content += '</ol>';
            content += '</div><p>&nbsp;</p>';
            content += '<hr />';
            if($('#cnblogs_post_body').length != 0 )
            {
                $($('#cnblogs_post_body')[0]).prepend(content);
            }
        }
    }
    
    GenerateContentList();
    </script>
    页脚Html代码

    保存,就会出现一开始图片显示的效果

  • 相关阅读:
    Hadoop 组成
    umlの活动图
    一种基于ES5的JavaScript继承
    Unity3.x游戏开发经典教程 书例 100%完毕~
    AndroidMainifest标签使用说明1——&lt;action&gt;
    JS图片自己主动轮换效果实现
    现有一些开源ESB总线的比較
    安装程序不能验证Update.inf文件的完整性,请确定加密服务正在此计算机上执行
    leetCode解题报告5道题(九)
    浅谈C++多态性
  • 原文地址:https://www.cnblogs.com/dc-earl/p/10949244.html
Copyright © 2020-2023  润新知