【博客园主题美化】《 那些年换过的主题 - 04 》

主题展示

重点

博客园一定要申请JS权限！

这个美化使用的主题是 Custom；使用highlight.js渲染引擎！！！要禁用 主题本身的默认Css！！！

基础主题设置如下：

页面定制Css代码

代码

@keyframes spin3D{from{transform:rotate3d(0.5,0.5,0.5,360deg)}to{transform:rotate3d(0deg)}}#loading{height:100%;background-color:#1d2630;display:flex;justify-content:center;align-items:center;position:fixed;top:0;left:0;right:0;overflow:hidden;z-index:99999999}.spinner-box{width:300px;height:300px;display:flex;justify-content:center;align-items:center;background-color:transparent}.leo{position:absolute;display:flex;justify-content:center;align-items:center;border-radius:50%}.blue-orbit{width:165px;height:165px;border:1px solid #91daffa5;animation:spin3D 3s linear .2s infinite}.green-orbit{width:120px;height:120px;border:1px solid #91ffbfa5;animation:spin3D 2s linear 0s infinite}.red-orbit{width:90px;height:90px;border:1px solid #ffca91a5;animation:spin3D 1s linear 0s infinite}.white-orbit{width:60px;height:60px;border:2px solid #fff;animation:spin3D 10s linear 0s infinite}.w1{transform:rotate3D(1,1,1,90deg)}.w2{transform:rotate3D(1,2,0.5,90deg)}.w3{transform:rotate3D(0.5,1,2,90deg)}

页首HTML代码

代码

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

页脚HTML代码

代码

<script src="https://guangzan.gitee.io/awescnb/index.js"></script>
<script>
  const config = {
    // 默认启用皮肤 'reacg'
    // 在这里添加自定义配置
    // 当前为全部使用默认配置
    theme: {
      name: 'reacg',
      color: '#29898d',
      title: 'Leebri’s Blog！',
      favicon: 'https://s1.328888.xyz/2022/08/01/FqqGP.png',
      avatar: 'https://pic.cnblogs.com/avatar/2937389/20220723235216.png',
      headerBackground: 'https://api.mtyqx.cn/api/random.php'

    },
    emoji: {
      enable: true,
      buttonIcon: "

标签：enable,04,博客园,主题,value,label,https,height,true	

From： https://www.cnblogs.com/-CO-/p/17967473