榜上有名
新朋友 尊贵VIP

WordPress子比美化教程（持续更新中）2025/12/14更新

030012000

本页主题美化内容是布丁资源站在建站时一个一个测试过无任何错误的记录合集，使用之前先参考本站，若觉得实用就拿去用吧，布丁资源站会持续的更新美化教程！

美化说明

  • 主题美化、小工具可能会有一定程度使网站加载缓慢、CSS 全局污染等等一系列的问题，请一定要测试后在进行美化。
  • 主题美化可能会对主题文件进行修改，更新时请及时备份主题美化的文件，或者收藏本站，以免一些主题页面或美化效果丢失。

必要说明：（核心重点）

↓↓↓↓↓↓↓↓↓↓不会添加代码的看下面↓↓↓↓↓↓↓↓↓
（最新版子比主题）CSS 代码添加到后台：子比主题设置–>>自定义代码–>>自定义 CSS 样式
（最新版子比主题）JS 即 javascript 代码添加到：后台子比主题设置–>>自定义代码–>>自定义 javascript 代码
（最新版子比主题）没有特殊说明的小工具，自定义 HTML 小工具：添加网站后台–>>外观–>>小工具–>>点击【自定义 HTML】选择放置的位置—>把代码复制进去，保存即可。
↑↑↑↑↑↑不会添加代码的看上面↑↑↑↑↑↑
其他添加方式的，我会在教程里告知，若只需添加 CSS+JS 的教程，我可能不重复告知了，请注意看上面的方法。
有些美化教程本站已经发布的，本文章将不再进行编写教程，直接跳转到文章页面。

图片[1]-WordPress子比美化教程（持续更新中）2025/12/14更新-布丁资源站

我们第一步将下面的代码放到：子比主题–>>自定义CSS样式、

.figure{
    width: 15px;
    animation:0ms;
    -webkit-animation:rotateImg 3s linear infinite;
    vertical-align: middle;
  }
  @keyframes rotateImg {
    0% {transform : rotate(0deg);}
    100% {transform : rotate(360deg);}
  }
  @-webkit-keyframes rotateImg {
      0%{-webkit-transform : rotate(0deg);}
    100%{-webkit-transform : rotate(360deg);}
  }
图片[2]-WordPress子比美化教程（持续更新中）2025/12/14更新-布丁资源站
/*总裁 */
<style>
    .mx-containers {
        box-sizing: content-box;
        max-width: 1200px;
        margin-left: auto;
        margin-right: auto;
        padding-left: 15px;
        padding-right: 15px;
    }

    @media (min-width: 640px) {
        .mx-containers {
            padding-left: 30px;
            padding-right: 30px;
        }
    }

    @media (min-width: 960px) {
        .mx-containers {
            padding-left: 40px;
            padding-right: 40px;
        }
    }

    .mx-containers::before,
    .mx-containers::after {
        content: "";
        display: table;
    }

    .mx-containers::after {
        clear: both;
    }

    .mx-containers> :last-child {
        margin-bottom: 0;
    }

    .mx-footer-new {
        z-index: 999;
        position: fixed;
        left: 50%;
        bottom: 30px;
        max-width: 920px;
        -webkit-transform: translate(-50%);
        transform: translate(-50%);
        background-color: #fff;
        box-shadow: 0 20px 40px 0 rgba(0, 0, 0, .1);
        border-radius: 50px;
        padding: 15px 20px;
        line-height: 33px;
        box-sizing: border-box;
    }

    .mx-footer-newbox {
        display: flex;
        align-items: center;
    }

    .mx-footer-newbox a.newwen {
        color: #666;
        text-decoration: none;
    }

    .mx-footer-newbox a.newwen em {
        margin-right: 10px;
        animation: my-face 5s infinite ease-in-out;
        display: inline-block;
    }

    em,
    cite,
    i {
        font-style: normal;
    }

    em {
        color: #f0506e;
    }

    .mx-footer-newbox a.newbtn {
        display: inline-block;
        text-align: center;
        font-size: 14px;
        width: 110px;
        height: 33px;
        line-height: 33px;
        margin-left: 100px;
        color: #fff;
        border-radius: 50px;
        background: #006fff;
        text-decoration: none;
    }

    @keyframes my-face {

        2%,
        24%,
        80% {
            transform: translate(0, 1.5px) rotate(1.5deg);
        }

        4%,
        68%,
        98% {
            transform: translate(0, -1.5px) rotate(-.5deg);
        }

        38%,
        6% {
            transform: translate(0, 1.5px) rotate(-1.5deg);
        }

        8%,
        86% {
            transform: translate(0, -1.5px) rotate(-1.5deg);
        }

        10%,
        72% {
            transform: translate(0, 2.5px) rotate(1.5deg);
        }

        12%,
        64%,
        78%,
        96% {
            transform: translate(0, -.5px) rotate(1.5deg);
        }

        14%,
        54% {
            transform: translate(0, -1.5px) rotate(1.5deg);
        }

        16% {
            transform: translate(0, -.5px) rotate(-1.5deg);
        }

        18%,
        22% {
            transform: translate(0, .5px) rotate(-1.5deg);
        }

        20%,
        36%,
        46% {
            transform: translate(0, -1.5px) rotate(2.5deg);
        }

        26%,
        50% {
            transform: translate(0, .5px) rotate(.5deg);
        }

        28% {
            transform: translate(0, .5px) rotate(1.5deg);
        }

        30%,
        40%,
        62%,
        76%,
        88% {
            transform: translate(0, -.5px) rotate(2.5deg);
        }

        32%,
        34%,
        66% {
            transform: translate(0, 1.5px) rotate(-.5deg);
        }

        42% {
            transform: translate(0, 2.5px) rotate(-1.5deg);
        }

        44%,
        70% {
            transform: translate(0, 1.5px) rotate(.5deg);
        }

        48%,
        74%,
        82% {
            transform: translate(0, -.5px) rotate(.5deg);
        }

        52%,
        56%,
        60% {
            transform: translate(0, 2.5px) rotate(2.5deg);
        }

        58% {
            transform: translate(0, .5px) rotate(2.5deg);
        }

        84% {
            transform: translate(0, 1.5px) rotate(2.5deg);
        }

        90% {
            transform: translate(0, 2.5px) rotate(-.5deg);
        }

        92% {
            transform: translate(0, .5px) rotate(-.5deg);
        }

        94% {
            transform: translate(0, 2.5px) rotate(.5deg);
        }

        0%,
        100% {
            transform: translate(0, 0) rotate(0);
        }
    }

    @media (max-width: 767px) {
        .mx-visible\@s {
            display: none !important;
        }
    }
</style>
<div class="mx-containers mx-visible@s">
    <div class="mx-footer-new">
        <div class="mx-footer-newbox mx-flex">
            <div class="mx-flex-1">
                <a href="在这里放URL" class="newwen">
                    <em class="my-face">NEW</em>浩旭的资源站 - 子比美化教程
                </a>
            </div>
            <a href="在这里放URL" class="newbtn" style="color: #fff;">立即前往</a>
        </div>
    </div>
</div>
© 版权声明
版权声明
1
本站名称：布丁博客
2
本站网址：li.hxyxlt.top
3
本网站的文章部分内容可能来源于网络，仅供大家学习与参考，如有侵权，请联系站长进行删除处理。
4
本站一切资源不代表本站立场，并不代表本站赞同其观点和对其真实性负责。
5
本站一律禁止以任何方式发布或转载任何违法的相关信息，访客发现请向站长举报。
6
本站附件资源、教程等内容如因时效原因失效或不可用，请评论区留言或联系站长及时更新。
THE END
子比美化
喜欢就支持一下吧
点赞2000 分享
布丁的头像-布丁资源站黑钻会员
子比主题 – 简约右侧悬浮按钮美化-布丁资源站
子比主题 – 简约右侧悬浮按钮美化
子比主题 – 简约右侧悬浮按钮美化
3天前 2019
子比主题美化-底部添加一款底部白色波浪滚动页脚(日夜间已适配)-布丁资源站
子比主题美化-底部添加一款底部白色波浪滚动页脚(日夜间已适配)
子比主题美化-底部添加一款底部白色波浪滚动页脚(日夜间已适配)
4天前 1031
浩旭子比主题用户打赏插件 1.0-布丁资源站
浩旭子比主题用户打赏插件 1.0
浩旭子比主题用户打赏插件 1.0
5天前 622
子比美化 – 添加一个仿总裁主题官网底部推广模块-布丁资源站
子比美化 – 添加一个仿总裁主题官网底部推广模块
子比美化 – 添加一个仿总裁主题官网底部推广模块
7天前 555
独家仿B2底部页脚样式美化（夜间不匹配）-布丁资源站
独家仿B2底部页脚样式美化（夜间不匹配）
独家仿B2底部页脚样式美化（夜间不匹配）
7天前 310
子比美化给弹窗添加一个美化-布丁资源站
子比美化给弹窗添加一个美化
子比美化给弹窗添加一个美化
8天前 203
相关推荐
WordPress子比美化教程（持续更新中）2025/12/14更新-布丁资源站
WordPress子比美化教程（持续更新中）2025/12/14更新
WordPress子比美化教程（持续更新中）2025/12/14更新
4小时前 3001
子比主题 – 简约右侧悬浮按钮美化-布丁资源站
子比主题 – 简约右侧悬浮按钮美化
子比主题 – 简约右侧悬浮按钮美化
3天前 2019
子比主题美化-底部添加一款底部白色波浪滚动页脚(日夜间已适配)-布丁资源站
子比主题美化-底部添加一款底部白色波浪滚动页脚(日夜间已适配)
子比主题美化-底部添加一款底部白色波浪滚动页脚(日夜间已适配)
4天前 1031
浩旭子比主题用户打赏插件 1.0-布丁资源站
浩旭子比主题用户打赏插件 1.0
浩旭子比主题用户打赏插件 1.0
5天前 622
评论 抢沙发

请登录后发表评论

    暂无评论内容

用户封面
布丁的头像-布丁资源站黑钻会员
12月13日 国家公祭日
子比主题 – 简约右侧悬浮按钮美化
子比主题美化-底部添加一款底部白色波浪滚动页脚(日夜间已适配)
浩旭子比主题用户打赏插件 1.0
子比美化 – 添加一个仿总裁主题官网底部推广模块
独家仿B2底部页脚样式美化（夜间不匹配）
百度一下-协助本站SEO