博客园主题美化

权限申请

管理 - 设置 - 博客侧边栏公告 - 申请JS权限

资源上传

管理 - 设置 - 文件 - 上传资源文件

主题定制

管理 - 设置

博客侧边栏公告

<!-- 公告头像 -->
<img src="https://pic.cnblogs.com/avatar/41703/20240823155443.png">

页面定制 CSS 代码

/* 隐藏顶部导航 */
#top_nav {
    display:none;
}

/* 隐藏页脚 */
.footer {
    display: none;
}

/* 博客标题字体 */
a.headermaintitle:visited, a.headermaintitle:active, a.headermaintitle:link {
    color: #fff;
    font-size: 24px;
    font-weight: bold;
    text-decoration: none;
}

/* 菜单字体 */
.menu {
    font-size: 14px;
    font-weight: bold;
}

/* 正文字体（摘要）*/
body {
    font-size: 14px;
}

/* 段落字体 */
p {
    font-size: 14px;
}

/* 代码字体&背景透明 */
code.hljs {
    font-size: 14px;
    background-color: transparent;
}

/* 文章标题字体&底纹 */
.postTitle {
    background-color: #EFEFEF;
    padding-left: 8px;
    padding-top: 3px;
    padding-bottom: 0px;
    border: 1px solid #ccc;
    font-size: 20px;
    font-weight: bold;
}

/* 文章H1标题字体 */
.postTitle h1 {
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 10px;
}

/* 文章H1标题字体 去掉左侧间隔 */
h3 {
    padding-left: 0px;
}

/* 博客侧边栏字体 */
li {
    font-size: 14px;
}

/* 积分与排名字体 */
.newsItem {
    font-size: 14px;
}

/* 返回顶部 */
.backToTop {
     border: 1px dashed;
     display: none;
     width: 18px;
     line-height: 1.2;
     padding: 5px 0;
     background-color: #fff;
     color: #000;
     font-size: 12px;
     text-align: center;
     position: fixed;
     _position: absolute;
     right: 10px;
     bottom: 100px;
     _bottom: "auto";
     cursor: pointer;
     opacity: .6;
     filter: Alpha(opacity=60);
}

首页 HTML 代码

页脚 HTML 代码

<!-- 设置博客Icon -->
<script type="text/javascript">
    var linkObject = document.createElement('link');
    linkObject.rel = 'icon';
    linkObject.href = 'https://files.cnblogs.com/files/blogs/45285/favicon.ico?t=1724859480&download=true';
    document.head.appendChild(linkObject);
</script>

<!-- 鼠标点击效果 -->
<script type="text/javascript" src="https://files.cnblogs.com/files/blogs/45285/cursor-effects.js?t=1724857597&download=true"></script>

<!-- 返回顶部 -->
<script type="text/javascript">
(function() {
    var $backToTopTxt = "返回顶部", $backToTopEle = $('<div class="backToTop"></div>').appendTo($("body"))
        .text($backToTopTxt).attr("title", $backToTopTxt).click(function() {
            $("html, body").animate({ scrollTop: 0 }, 120);
    }), $backToTopFun = function() {
        var st = $(document).scrollTop(), winh = $(window).height();
        (st > 0)? $backToTopEle.show(): $backToTopEle.hide();
        //IE6下的定位
        if (!window.XMLHttpRequest) {
            $backToTopEle.css("top", st + winh - 166);
        }
    };
    $(window).bind("scroll", $backToTopFun);
    $(function() { $backToTopFun(); });
})();
</script>

<!-- 图片点击放大 -->
<script type="text/javascript" src="https://blog-static.cnblogs.com/files/zengcongcong/img.enlarge.js"></script>
<div id="outerdiv" style="text-align: center;position: fixed;z-index: 1000;top: 0;left: 0;
    width: 100%;height: 100%;background-color: rgba(255,255,255,.9);">
    <img id="bigimg" style="height: auto;width: 65%;border: 5px solid #7e8c8d; 
        margin: auto;position: absolute;top: 0;bottom: 0;left: 0;right: 0;" src="" />
</div>