博客网站右上角添加悬挂年兽 喜增龙年喜气源码

温馨提示:本文最后更新于2024-01-02 10:27:02,某些文章具有时效性,若有错误或已失效,请在下方留言。
图片[1]-博客网站右上角添加悬挂年兽 喜增龙年喜气源码

网站演示

图片[2]-博客网站右上角添加悬挂年兽 喜增龙年喜气源码

子比主题设置>>自定义代码>>自定义css,填写如下代码

@media screen and (min-width: 850px){
    .NewYear {
        width: 260px;
        height: 300px;
        display: inline-block;
        background: url(图片地址) no-repeat 50%/100%;
        vertical-align: middle;
        position: fixed;
        left: 85.8%;
        top: 55px;
        z-index: 50;
        cursor: pointer;
        animation: new-year 1.2s ease-in-out 0s infinite alternate;
        margin-left: -1px;
        transform-origin: 50% 0;
        pointer-events: none;
    }
    }
    @keyframes new-year{
      0% {
        transform: rotate(10deg);
    }
      100%{
                transform: rotate(-10deg);
      }
    }

子比主题设置>>自定义代码>>自定义html代码,填写如下代码

<div class="NewYear"></div>

CSS代码放到自定义css文件里面,html放到你的自定义头部html即可!!

注意:如果你的是全屏网站建议在pointer-events: none;下面加一行

即css代码16行左右哪里加

z-index: 999;

要不然会被文章的上浮遮挡!!

文章版权声明 1、本网站名称:优盟盒子
2、本站永久网址:https://umsbox.com
3、本网站的文章部分内容可能来源于网络,仅供大家学习与参考,如有侵权,请联系站长 QQ5941950进行删除处理。
4、本站一切资源不代表本站立场,并不代表本站赞同其观点和对其真实性负责。
5、本站一律禁止以任何方式发布或转载任何违法的相关信息,访客发现请向站长举报
6、本站资源大多存储在云盘,如发现链接失效,请联系我们我们会第一时间更新。

© 版权声明
THE END
喜欢就支持一下吧
点赞12赞赏 分享
评论 共1条

请登录后发表评论