网站添加背景开屏动画为原神启动

代码&文件

文件

yuanshen.svg

下载

svg文件

11.3K

代码

body::after {
    content: "";
    position: fixed;
    inset: 0;
    background-color: white;
    z-index: 9999;
    background-image: url('yuanshen.svg'); /* 用绝对或相对路径 */
    background-repeat: no-repeat;
    background-position: center;
    background-size: 30%;
    animation: fadeOut 2s ease-out 1s forwards;
    pointer-events: auto;
}
@keyframes fadeOut {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
        visibility: hidden;
    }
}

使用教程

首先上传yuanshen.svg文件到一个可以访问地方，将上述代码放置在Zibll主题设置>全局&功能>自定义代码>自定义CSS样式中并进行修改。