• 第二种主题


    页面定制 CSS 代码

    #loading {
      bottom: 0;
      left: 0;
      position: fixed;
      right: 0;
      top: 0;
      z-index: 9999;
      background-color: #f4f5f5;
      pointer-events: none;
    }
    .loader-inner {
      will-change: transform;
       40px;
      height: 40px;
      position: absolute;
      top: 50%;
      left: 50%;
      margin: -20px 0 0 -20px;
      background-color: #3742fa;
      border-radius: 50%;
      animation: scaleout 0.6s infinite ease-in-out forwards;
      text-indent: -99999px;
      z-index: 999991;
    }
    @keyframes scaleout {
      0% {
        transform: scale(0);
        opacity: 0;
      }
      40% {
        opacity: 1;
      }
      100% {
        transform: scale(1);
        opacity: 0;
      }
    }
    

    博客侧边栏公告(支持HTML代码) (支持 JS 代码)

    <script src="https://guangzan.gitee.io/awescnb/index.js"></script>
    <script>$.awesCnb({
        // 基本配置
        theme: {
            name: 'simple',
            color: '#FFB3CC',
            title: '力拔山兮气盖世',
            contentSize: 'mid',
            headerBackground: 'https://i0.hdslb.com/bfs/article/d2745ce0f999eb26209c81338ea9473015e16b46.png@1320w_742h.webp',
            avatar: '//i1.hdslb.com/bfs/face/37114ab1a7374711f2a8af257f2bc81fb2fe2365.jpg',
            favicon: '',
        },
        // 代码高亮
        highLight: {
            type: 'atomOneDark',
            inDarkMode: 'atomOneDark',
        },
        // 代码行号
        lineNumbers: {
            enable: true,
        },
        // github图标
        github: {
            enable: true,
            color: '#ffb3cc',
            url: 'https://github.com/SanForfive',
        },
        // 图片灯箱
        imagebox: {
            enable: true,
        },
        // 文章目录
        catalog: {
            enable: true,
            position: 'left',
        },
        // 返回顶部按钮
        back2top: {
            enable: true,
            type: 'complex',
        },
        // 右下角按钮列表
        tools: {
            enable: true,
            initialOpen: true,
            draggable: false,
        },
        // 点击特效
        click: {
            enable: true,
            auto: false,
            colors: ['#FF1461', '#18FF92', '#5A87FF', '#FBF38C'],
            size: 30,
            maxCount: 15,
        },
        // 评论输入框表情
        emoji: {
            enable: true,
            showRecents: false,
            recentsCount: 20,
            showPreview: false,
            showSearch: false,
        },
        // 暗色模式
        darkMode: {
            enable: true,
            autoDark: true,
            autoLight: true,
        },
        // 弹出公告
        notice: {
            enable: false,
            text: [],
        },
        // 首页列表图
        indexListImg: {
            enable: false,
            imgs: [],
        },
        // 顶部加载进度条
        topProgress: {
            enable: true,
            page: 'all',
            agent: 'pc',
            background: '#FFB3CC',
            height: '5px',
        },
        indexTimeline: {
            enable: false,
        },
    signature: {
        enable: true,
        contents: [
        "Hi!我现在呢还是学生,想想初中的同学都结婚生子了,自己,嗯。(啊!!!)本科以及硕士读的都是应用统计 在这里请广大网友多多指教了!如果有机会的话,大家可以一起造轮子  <b style='color:#ff6b81'>HuangB2ydjm</b>.",
        "<b>console.log(new);</b>",
        ],
    },
        // 随笔页尾部签名
        postSignature: {
            enable: true,
            content: ['我分享的越多,收获的也就越多'],
            licenseLink: '',
        },
        // 背景图片或颜色
        bodyBackground: {
            enable: false,
            value: '',
            opacity: 1,
            repeat: false,
        },
        // 图表
        charts: {
            enable: true,
            pie: {
                title: 'My skills',
                data: {
                    labels: ['JavaScript', 'css', 'Vue', 'React', 'wechat'],
                    values: [40, 30, 20, 10, 20],
                },
            },
        },
        // 锁屏
        lock: {
            enable: true,
            background: '',
            strings: ['明日复明日'],
        },
        // footer链接
        links: [
            {
                name: 'HuangB2ydjm',
                link: 'https://www.cnblogs.com/xiaofeisnote/',
            },
            {
            name: 'google',
            link: 'https://www.google.com/',
        },
        {
            name: 'b-站',
            link: 'https://www.bilibili.com/',
        },
        {
            name: 'awescnb-docs',
            link: 'https://guangzan.gitee.io/awescnb-docs/',
        },
        ],
    })
    </script>
    
    
    <!-- 第一款自主放置的鼠标点击特效 -->
    <script src="https://files.cnblogs.com/files/sanforfive/sketch.js"></script>
    

    页首 HTML 代码

    <div id="loading"><div class="loader-inner"></div></div>
    
    
    <div id="clickCanvas" style=" position:fixed;left:0;top:0;z-index:999999999;pointer-events:none;"></div>
    <script type="text/javascript" src="https://files.cnblogs.com/files/sanforfive/firework.js"></script>
    

    页脚 HTML 代码

    <!-- 标签页图标最上面的图标 -->
    <script type="text/javascript" language="javascript">
      //Setting ico for cnblogs
      var linkObject = document.createElement('link');
      linkObject.rel = "shortcut icon";
      linkObject.href = "https://files.cnblogs.com/files/sanforfive/230160135.ico";
      document.getElementsByTagName("head")[0].appendChild(linkObject);
    </script>
    

    用法:直接复制到相应位置就好了

  • 相关阅读:
    JS中的this指向问题
    Jinja2用法总结
    Kafka 生产者 拦截器
    Kafka 生产者 工作流程和Demo示例
    Kafka 验证集群部署和吞吐量测试
    Kafka 线上环境部署需要考虑的因素
    Kafka单点环境安装
    Kafka和Confluent的关系
    Kafka 概要设计
    ActiveMQ 介绍安装使用入门
  • 原文地址:https://www.cnblogs.com/sanforfive/p/13584037.html
Copyright © 2020-2023  润新知