给你的网站添加一个原神启动开屏动画

当前位置:首页>技术屋>WordPress教程>给你的网站添加一个原神启动开屏动画

本篇文章也是采用了自定义文章css,大家打开文章时就能够看到那个开屏动画

?教程开始

给你的网站添加一个原神启动开屏动画

先保存上方原神图,也可以自行发挥,但是图片需要清晰可见然后去自定义css里填入:

/*原神启动*/
body:after {
    content: " ";
    position: fixed;
    inset: 0;
    background-color: white;
    z-index: 999;
    background-image: url(图片链接);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 30%;
    animation: fadeOut 3s;
    animation-fill-mode: forwards;
    -webkit-transition: fadeOut 3s;
    transition: fadeOut 3s;
    pointer-events: none;
}
@keyframes fadeOut {
  50% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}

该教程原作者为泽泽社长

温馨提示:

文章标题:给你的网站添加一个原神启动开屏动画

文章链接:https://www.1001r.cn/275.html

更新时间:2023年11月26日

站内部分内容由互联网用户自发贡献,该文观点仅代表作者本人。

本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。

如发现本站有涉嫌抄袭侵权/违法违规的内容, 请联系我们xiuzheng@1001c.cn我们将第一时间处理!

给TA打赏
共{{data.count}}人
人已打赏
0 条回复 A文章作者 M管理员
    暂无讨论,说说你的看法吧