博客园 - 用过的博客园主题

 

 

 

页面定制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;width: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;}}


/* 默认配置 */
/* #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;width: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;}} */

/* 绚丽的彩虹 */
/* #loading{background:#000;background:radial-gradient(#222,#000);bottom:0;left:0;overflow:hidden;position:fixed;right:0;top:0;z-index:99999}.loader-inner{bottom:0;height:60px;left:0;margin:auto;position:absolute;right:0;top:0;width:100px}.loader-line-wrap{animation:spin 2s cubic-bezier(0.175,0.885,0.32,1.275) infinite;box-sizing:border-box;height:50px;left:0;overflow:hidden;position:absolute;top:0;transform-origin:50% 100%;width:100px}.loader-line{border:4px solid transparent;border-radius:100%;box-sizing:border-box;height:100px;left:0;margin:0 auto;position:absolute;right:0;top:0;width:100px}.loader-line-wrap:nth-child(1){animation-delay:-50ms}.loader-line-wrap:nth-child(2){animation-delay:-0.1s}.loader-line-wrap:nth-child(3){animation-delay:-150ms}.loader-line-wrap:nth-child(4){animation-delay:-0.2s}.loader-line-wrap:nth-child(5){animation-delay:-250ms}.loader-line-wrap:nth-child(1) .loader-line{border-color:#ea4747;height:90px;width:90px;top:7px}.loader-line-wrap:nth-child(2) .loader-line{border-color:#eaea47;height:76px;width:76px;top:14px}.loader-line-wrap:nth-child(3) .loader-line{border-color:#47ea47;height:62px;width:62px;top:21px}.loader-line-wrap:nth-child(4) .loader-line{border-color:#47eaea;height:48px;width:48px;top:28px}.loader-line-wrap:nth-child(5) .loader-line{border-color:#4747ea;height:34px;width:34px;top:35px}@keyframes spin{0%,15%{transform:rotate(0)}100%{transform:rotate(360deg)}} */

/* 动态星系 */
@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)}

/* 跳动的文字 */
/* #loading{background:#151728;overflow:hidden;position:fixed;right:0;top:0;bottom:0;left:0;z-index:99999}#load{position:absolute;width:600px;height:36px;left:50%;top:40%;margin-left:-300px;overflow:visible;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:default}#load div{position:absolute;width:20px;height:36px;opacity:0;font-family:Helvetica,Arial,sans-serif;animation:move 2s linear infinite;-o-animation:move 2s linear infinite;-moz-animation:move 2s linear infinite;-webkit-animation:move 2s linear infinite;transform:rotate(180deg);-o-transform:rotate(180deg);-moz-transform:rotate(180deg);-webkit-transform:rotate(180deg);color:#35c4f0}#load div:nth-child(2){animation-delay:.2s;-o-animation-delay:.2s;-moz-animation-delay:.2s;-webkit-animation-delay:.2s}#load div:nth-child(3){animation-delay:.4s;-o-animation-delay:.4s;-webkit-animation-delay:.4s;-webkit-animation-delay:.4s}#load div:nth-child(4){animation-delay:.6s;-o-animation-delay:.6s;-moz-animation-delay:.6s;-webkit-animation-delay:.6s}#load div:nth-child(5){animation-delay:.8s;-o-animation-delay:.8s;-moz-animation-delay:.8s;-webkit-animation-delay:.8s}#load div:nth-child(6){animation-delay:1s;-o-animation-delay:1s;-moz-animation-delay:1s;-webkit-animation-delay:1s}#load div:nth-child(7){animation-delay:1.2s;-o-animation-delay:1.2s;-moz-animation-delay:1.2s;-webkit-animation-delay:1.2s}@keyframes move{0%{left:0;opacity:0}35%{left:41%;-moz-transform:rotate(0deg);-webkit-transform:rotate(0deg);-o-transform:rotate(0deg);transform:rotate(0deg);opacity:1}65%{left:59%;-moz-transform:rotate(0deg);-webkit-transform:rotate(0deg);-o-transform:rotate(0deg);transform:rotate(0deg);opacity:1}100%{left:100%;-moz-transform:rotate(-180deg);-webkit-transform:rotate(-180deg);-o-transform:rotate(-180deg);transform:rotate(-180deg);opacity:0}}@-moz-keyframes move{0%{left:0;opacity:0}35%{left:41%;-moz-transform:rotate(0deg);transform:rotate(0deg);opacity:1}65%{left:59%;-moz-transform:rotate(0deg);transform:rotate(0deg);opacity:1}100%{left:100%;-moz-transform:rotate(-180deg);transform:rotate(-180deg);opacity:0}}@-webkit-keyframes move{0%{left:0;opacity:0}35%{left:41%;-webkit-transform:rotate(0deg);transform:rotate(0deg);opacity:1}65%{left:59%;-webkit-transform:rotate(0deg);transform:rotate(0deg);opacity:1}100%{left:100%;-webkit-transform:rotate(-180deg);transform:rotate(-180deg);opacity:0}}@-o-keyframes move{0%{left:0;opacity:0}35%{left:41%;-o-transform:rotate(0deg);transform:rotate(0deg);opacity:1}65%{left:59%;-o-transform:rotate(0deg);transform:rotate(0deg);opacity:1}100%{left:100%;-o-transform:rotate(-180deg);transform:rotate(-180deg);opacity:0}} */

/* 抖音风格 */
/* #loading{position:relative;background:#000;overflow:hidden;position:fixed;right:0;top:0;bottom:0;left:0;z-index:99999;}.text-magic{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(3);width:300px;font-size:36px;font-family:Raleway,Verdana,Arial;color:transparent;}.white{position:absolute;left:-10px;width:100%;height:1px;background:#000;z-index:4;animation:whiteMove 10s ease-out infinite;}.text-magic::before{content:attr(data-word);position:absolute;top:0;left:0;height:36px;color:red;overflow:hidden;z-index:2;filter:contrast(200%);text-shadow:1px 0 0 red;animation:move 0.95s infinite;}.text-magic::after{content:attr(data-word);position:absolute;top:0;left:-1px;height:36px;color:rgba(255,255,255,0.8);overflow:hidden;z-index:3;color:cyan;filter:contrast(200%);text-shadow:-1px 0 0 cyan;mix-blend-mode:lighten;animation:move 1.1s infinite 0.2s;}@keyframes whiteMove{9%{top:38px;}14%{top:8px;}18%{top:42px;}22%{top:1px;}32%{top:32px;}34%{top:12px;}40%{top:26px;}43%{top:7px;}99%{top:30px;}}@keyframes move{10%{top:-0.4px;left:-1.1px;}20%{top:0.4px;left:-0.2px;}30%{left:.5px;}40%{top:-0.3px;left:-0.7px;}50%{left:0.2px;}60%{top:1.8px;left:-1.2px;}70%{top:-1px;left:0.1px;}80%{top:-0.4px;left:-0.9px;}90%{left:1.2px;}100%{left:-1.2px;}} */


/* 行内代码块样式 */
/* .cnblogs-markdown :not(pre,div,td)>code, .blogpost-body :not(pre,div,td)>code {
    display: inline!important;
    padding-left: 4px!important;
    padding-right: 4px!important;
    background-color: #f6f6f6!important;
    border-radius: 4px!important;
    border: 1px solid #ddd;
    overflow-x: auto;
    font-size: 14px!important;
    font-family: "Menlo,Monaco,Consolas,'Courier New', monospace"!important;

    color: #e83e8c!important;
    word-break: break-word;
} */

.cnblogs-markdown :not(pre,div,td)>code, .blogpost-body :not(pre,div,td)>code {
    color: crimson!important;;
    background-color: rgba(222,222,222,0.3)!important;;
    padding-left: 4px!important;;
    padding-right: 4px!important;;
    font-family: Consolas, "Courier New", Courier, monospace!important;;
    font-size: 110%!important;;
}





/* 图片不居中 */
#cnblogs_post_body.blogpost-body-html img, #mainContent .cnblogs-markdown img {
    display: flex;
    margin: 0px!important;
    max-width: 100%!important;
    border-radius: 2px;
}

/* body {  
  font-family: "幼圆", sans-serif!important;
  font-size: 16px!important; 
} */

 

<div id="loading"><div class="loader-inner"></div></div>


<!-- 抖音风格 -->
<!-- <div id="loading">

    <div class="text-magic" data-word="Loading...">

        <div class="white"></div>

    </div>

</div> -->






<!-- 跳动的文字 -->
<!-- <div id="loading">

  <div id="load">

    <div>欢</div>

    <div>迎</div>

    <div>来</div>

    <div>到</div>

    <div>侯</div>

    <div>惠</div>

    <div>林</div>

    <div>的</div>

    <div>博</div>

    <div>客</div>

    <div>园</div>

    <div>Biu~</div>

  </div>

</div> -->








<!-- 动态星系 -->
<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="loading">

    <div class="loader-inner">

        <div class="loader-line-wrap">

            <div class="loader-line"></div>

        </div>

        <div class="loader-line-wrap">

            <div class="loader-line"></div>

        </div>

        <div class="loader-line-wrap">

            <div class="loader-line"></div>

        </div>

        <div class="loader-line-wrap">

            <div class="loader-line"></div>

        </div>

        <div class="loader-line-wrap">

            <div class="loader-line"></div>

        </div>

    </div>

</div> -->

 

<script type="text/javascript" language="javascript">
　　//Setting ico for cnblogs
　　var linkObject = document.createElement('link');
　　linkObject.rel = "shortcut icon";
　　linkObject.href = "https://blog-static.cnblogs.com/files/blogs/524473/bitbug_favicon.ico";
　　document.getElementsByTagName("head")[0].appendChild(linkObject);
</script>

<script src="https://blog-static.cnblogs.com/files/guangzan/loader.min.js"></script>

<script>
  const config = {
    // 默认启用皮肤 'reacg'
    // 在这里添加自定义配置
    // 当前为全部使用默认配置
    theme:{
      // 主题名称
      name: 'geek',
      // 头像
      // avatar: 'https://pic.cnblogs.com/avatar/2811394/20220324105253.png',
      avatar: 'https://images.cnblogs.com/cnblogs_com/blogs/524473/galleries/1577632/t_230508082346_blackRoles.jpg',
      title: 'Harley博客',
      favicon: 'https://pic.cnblogs.com/avatar/2811394/20220324105253.png',
      // log: '嘿嘿嘿! 看我控制台干什么,要美化可别联系我!',
      color: '#FFB3CC',
      // headerBackground: 'https://www.toopic.cn/public/uploads/small/1642749404919164274940482.jpg',
      // headerBackground: 'https://www.toopic.cn/public/uploads/small/1634201952212163420195232.jpg',
         headerBackground: 'https://s3.bmp.ovh/imgs/2024/03/29/441720b1cf91e9b1.jpg',
      //headerBackground: 'https://www.toopic.cn/public/uploads/small/1642746777809164274677740.jpg',

    },


    // 个性签名部分
    signature: {
        enable: true,
        contents: [
        "欢迎来到 <b style='color:#ff6b81'>Harley</b> 的博客园.",
        "<span style='color:black;font-style:italic;'>灯火阑珊丹桂明，爆竹声声尽乡情。九州华夏上元日，驱车一里赏花灯。</span>",
        "<span style='color:black;font-style:italic;'>遍寻金秋西湖景，难叙重游故园情。悠悠一苇飘荷处，不觉林深不见鹿。</span>",
        "<span style='color:black;font-style:italic;'>大风起兮云飞扬，胡辣汤浓何人尝？蓦然回首阑干外，他乡重逢仅隔墙。</span>",
        "<span style='color:black;font-style:italic;'>一声键来十指飞，沉浸其中魂不归。一念诗情忽闪现，归途一路雨霏霏。</span>",
        "<span style='color:black;font-style:italic;'>迢迢豫沪间，秋暑两重天。清风随雨落，只影日月牵。</span>",
        "<span style='color:black;font-style:italic;'>风闷夏夜冰镇瓜，吹着空调笑哈哈。涎游颚下双睛亮，清凉解口得一夸！</span>",
        "<span style='color:black;font-style:italic;'>一别故土尽三载，明珠之下深似海。今朝喜逢八方客，他日杯酒述情怀。</span>",
        "<span style='color:black;font-style:italic;'>何时烟雨落金城，一人撑伞两人行？蓦然回首放眼望，缘是形与影多情。</span>",
        "<span style='color:black;font-style:italic;'>抗原自测又核酸，树欲静兮风静难。椿萱并茂游子愿，家与河山两平安。</span>",
        "<span style='color:black;font-style:italic;'>晨风匆匆拂短袖，抗原自测门外留。辗转归寝神初定，本命之年沪逢秋。</span>",
        "<span style='color:black;font-style:italic;'>满腔热血入魔都，领略山河已三秋。一朝卸下千金甲，杯酒洗尽万两愁。</span>",
        "<span style='color:black;font-style:italic;'>陌上花正开，心中影徘徊。春风知我意，杯酒慰将来。</span>",
        "<span style='color:black;font-style:italic;'>阡陌花香春入水，鸟语随风向东流。艳阳高照轻声语，恐惊河畔初钓侯。</span>",
        "<span style='color:black;font-style:italic;'>霪雨艳阳三月中，柳絮拂面似凛冬。欲学孔某向咸亨，奈何两袖尽空空。</span>",
        ],
    },

    // 表情包
    emoji: {
        enable: true,
        buttonIcon: "🥳",
        emojiList: [
            {
            value: 'https://images.cnblogs.com/cnblogs_com/gshang/1626876/o_2001050555139.png',
            label: '',
            },
            {
                value: '🤣',
                label: '笑哭',
            },
            {
                value: '😃',
                label: '大笑',
            },
            {
                value: '😅',
                label: '苦笑',
            },
            {
                value: '😆',
                label: '斜眼笑',
            },
            {
                value: '😏',
                label: '得意',
            },
            {
                value: '😊',
                label: '微笑',
            },
            {
                value: '😎',
                label: '酷！',
            },
            {
                value: '😍',
                label: '花痴',
            },
            {
                value: '🙂',
                label: '呵呵',
            },
            {
                value: '🤩',
                label: '好崇拜哦',
            },
            {
                value: '🤔',
                label: '思考',
            },
            {
                value: '🙄',
                label: '白眼',
            },
            {
                value: '😜',
                label: '略略略',
            },
            {
                value: '😲',
                label: '呆住',
            },
            {
                value: '😭',
                label: '大哭',
            },
            {
                value: '🤯',
                label: '头炸了',
            },
            {
                value: '😰',
                label: '冷汗',
            },
            {
                value: '😱',
                label: '吓死了',
            },
            {
                value: '🤪',
                label: '略略略',
            },
            {
                value: '😵',
                label: '晕',
            },
            {
                value: '😡',
                label: '愤怒',
            },
            {
                value: '🥳',
                label: '祝贺',
            },
            {
                value: '🤡',
                label: '小丑竟是我',
            },
            {
                value: '🤫',
                label: '嘘~',
            },
            {
                value: '🐒',
                label: '猴',
            },
            {
                value: '🤭',
                label: '笑笑不说话',
            },
            {
                value: '🐂',
                label: '牛',
            },
            {
                value: '🍺',
                label: '啤酒',
            }
        ]
    },



    lineNumbers: {
        enable: true,
    },

    // 点击特效
    click: {
        enable: false,
        auto: true,
        // colors: ['#FFC0CB','#EE82EE','#87CEFA','#FFFAFA'],
        // colors: ['#FF1461', '#18FF92', '#5A87FF', '#FBF38C'],
        size: 30,
        maxCount: 50,
    },

    // 图片灯箱
    imagebox: {
      enable: true,
    },
    
    // 深色模式
    darkMode: {
      enable: true,
      autoDark: false,
      autoLight: false
    },

    // 博文目录
    catalog: {
      enable: true,
      position: 'left',
    },

    // 弹幕
    barrage: {
        enable: true,
        opacity: 0.6,
        colors: [],
        barrages: [],
        indexBarrages: [],
        postPageBarrages: [],
    },


    // Live2D 模型
    live2d: {
        enable: true,
        page: 'all',
        agent: 'pc',
        model: 'chitose',
        width: 150,
        height: 200,
        position: 'left',
        gap: 'default',
    },
    // 博客签名
    postSignature: {
        enable: true,
        enableLicense: true,
        licenseName: '',
        licenseLink: '',
        content: ['这是一条自定义内容', '这是一条自定义内容'],
    },

    // 代码高亮
    highLight: {
        dark: 'atomOneDark',
        //light: 'atomOneLight',
        light: 'taptap',
    },


  }
  $.awesCnb(config)


</script>

 

posted @   HOUHUILIN  阅读(26)  评论(0)  编辑  收藏  举报
相关博文：
· 博客园 - 2024年10月24日之前使用的主题
· Typora - typora主题样式
· 博客园的使用
· 『记录』我的博客园主题定制代码
· 博客园主题第二弹
阅读排行：
· 阿里最新开源QwQ-32B，效果媲美deepseek-r1满血版，部署成本又又又降低了！
· SQL Server 2025 AI相关能力初探
· AI编程工具终极对决：字节Trae VS Cursor，谁才是开发者新宠？
· 开源Multi-agent AI智能体框架aevatar.ai，欢迎大家贡献代码
· Manus重磅发布：全球首款通用AI代理技术深度解析与实战指南
点击右上角即可分享
微信分享提示
AI IDE Trae