#

luxiaotao1123

2021-12-21 4d767348e1c46630edbc8faf4c90a77795dbc399

 static/css/index.css

@@ -150,6 +150,71 @@
    transform:translate(0,0);
}

.title-box {
    position:absolute;
    top:40%;
    left:8%;
    transform:translateY(-50%);
    color:#fff;
    z-index:2;
    pointer-events:none;
}
.title-box .title {
    font-size:36px;
    perspective:600px;
    -webkit-perspective:600px;
    -moz-perspective:600px;
}
.title-box .title i {
    display:inline-block;
    font-style:normal;
    opacity:0;
    transform:rotateY(90deg);
    transition:all 5000ms;
    transform-style:preserve-3d;
    -webkit-transform-style:preserve-3d;
}
.title-box.show .title i {
    opacity:1;
    transform:rotateY(0);
}
.title-box.show .say {
    opacity:1;
    transform:translateX(0);
}
.title-box .say {
    font-size:12px;
    color:#888;
    padding:20px 0 20px 40px;
    opacity:0;
    transform:translateX(20px);
    transition:all 2000ms;
    transition-delay:2000ms;
}
.title-box.show .use {
    opacity:1;
    transform:translateY(0);
}
.title-box .say p {
    padding:0;
}
.title-box .use {
    font-size:14px;
    color:#fff;
    display:flex;
    align-items:center;
    padding-left:40px;
    opacity:0;
    transform:translateY(20px);
    transition:all 2000ms;
    transition-delay:2000ms;
}
.title-box .use div {
    height:1px;
    background-color:#fff;
    width:80px;
    margin-right:10px;
}


#container {