笑死~我的博客美化脚本分享

RainPPR(ツ) / 2024-01-13 / 原文

笑死~我的博客美化脚本分享

前置提醒

本页面使用魔法代码,与其他页面的代码块不同,本页所有代码块不自动换行。

使用如下代码实现:


基本设置

博客皮肤:facebook
JS权限:已开通

渲染引擎:highlight.js
显示行号,取消 Mac 风格
代码字体:默认
系统浅色模式时主题:stackoverflow-light

image

侧边栏

My Skills 使用:https://skillicons.dev

My SkillsMy Skills

页面定制 CSS 代码

全面去广告 + 美化。


页首 HTML 代码

主要是一些框架和 CDN 上的 JS。

<div id="loading">
    <div class="spinner-box">
        <div class="blue-orbit leo"></div>
        <div class="green-orbit leo"></div>
        <div class="red-orbit leo"></div>
        <div class="white-orbit w1 leo"></div>
        <div class="white-orbit w2 leo"></div>
        <div class="white-orbit w3 leo"></div>
    </div>
</div>

<div id="scroll-page-top" style="display: block; position: fixed; bottom: 20px; right: 20px; padding: 6px; color: #FFF; background-color: #AAA; opacity: 0.7; border-radius: 20px; cursor: pointer; z-index: 999;"><span class="icon-circle-arrow-up" aria-hidden="true"></span> Page Top</div>

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize-opentype.css/0.2.4/normalize-opentype.min.css" integrity="sha512-C7dUXX4Gjv3oOFwuIJ2bMn+ZDvAlCLKH5JKzHMYVQUecTEVkHzu/SL5N6hkyOWyUdV13EIZDukiFcAl9LU/hAg==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/lxgw-wenkai-webfont/1.7.0/style.min.css" integrity="sha512-YZW7jSV4QrwpPzFxB77lAW4qNIeS6RaipaStONrpmbJsyh3zxM/3VoeQrrGlYkNS5nIjsKFURRHnsKhmE/vWmg==" crossorigin="anonymous" referrerpolicy="no-referrer" />

<script src="https://cdnjs.cloudflare.com/ajax/libs/KaTeX/0.15.6/contrib/mathtex-script-type.min.js" integrity="sha512-MBhOGY4yRA2eATtRGTcrDJCRqcnLai5+uu47GA2ueVr1MPzirC/iogLWRA8CXTlOTK09VI4fdTe4qE4LBfjsHw==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/KaTeX/0.15.6/contrib/mhchem.min.js" integrity="sha512-V1hl0fnOXW6Cdqe5ZVqtw8TBpJVpu3XRDRQti96j/04+tMarPrCdXEUE3UdfvfKYTpOn9DV4zEZBVr0HhDiuiQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/3.2.1/css/font-awesome.min.css" integrity="sha512-IJ+BZHGlT4K43sqBGUzJ90pcxfkREDVZPZxeexRigVL8rzdw/gyJIflDahMdNzBww4k0WxpyaWpC2PLQUWmMUQ==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/sharer.js/0.5.1/sharer.min.js" integrity="sha512-lMc8cG0mpFInehBNaFfAywToFq1hxBY7TgoTVCandnIR4KJ8lS6oXj3yWuyUE3TiEFPbD554Iq+KL5xKipPE4w==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/heti/0.9.4/heti-addon.min.js" integrity="sha512-GChf2qekcjrSoPicCypQLPqkaZkEnkcsJr85AmkczY0HG5SkfbxOmZY6RoFJLdoeKTGk8EZvkRBaF7BIqV1Ipw==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/heti/0.9.4/heti.min.css" integrity="sha512-/My2cHBMxofuHmAIIK29zje0pIqA2iCC9HDMa76E1jzK5u+wudGzJMMnTsdA5FmVGsoXB1xoJM7fKhniOhz+HA==" crossorigin="anonymous" referrerpolicy="no-referrer" />

页脚 HTML 代码

主要是 JS 脚本和触发一类的。