div+css背景光芒照耀转动动画效果代码
代码语言：html
所属分类：背景
代码描述：div+css背景光芒照耀转动动画效果代码
下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<style>
html {
height: 100%;
background: #ffee00;
overflow: hidden;
}
body {
height: 100%;
display: -webkit-box;
display: flex;
-webkit-box-pack: center;
justify-content: center;
-webkit-box-align: center;
align-items: center;
}
.line {
position: absolute;
top: 50%;
left: -50%;
}
.lines0 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin0 10s linear infinite;
animation: spin0 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(0deg);
transform: rotateX(10deg) rotateZ(0deg);
}
.lines1 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin1 10s linear infinite;
animation: spin1 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(3.6deg);
transform: rotateX(10deg) rotateZ(3.6deg);
}
.lines2 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin2 10s linear infinite;
animation: spin2 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(7.2deg);
transform: rotateX(10deg) rotateZ(7.2deg);
}
.lines3 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin3 10s linear infinite;
animation: spin3 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(10.8deg);
transform: rotateX(10deg) rotateZ(10.8deg);
}
.lines4 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin4 10s linear infinite;
animation: spin4 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(14.4deg);
transform: rotateX(10deg) rotateZ(14.4deg);
}
.lines5 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin5 10s linear infinite;
animation: spin5 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(18deg);
transform: rotateX(10deg) rotateZ(18deg);
}
.lines6 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin6 10s linear infinite;
animation: spin6 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(21.6deg);
transform: rotateX(10deg) rotateZ(21.6deg);
}
.lines7 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin7 10s linear infinite;
animation: spin7 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(25.2deg);
transform: rotateX(10deg) rotateZ(25.2deg);
}
.lines8 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin8 10s linear infinite;
animation: spin8 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(28.8deg);
transform: rotateX(10deg) rotateZ(28.8deg);
}
.lines9 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin9 10s linear infinite;
animation: spin9 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(32.4deg);
transform: rotateX(10deg) rotateZ(32.4deg);
}
.lines10 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin10 10s linear infinite;
animation: spin10 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(36deg);
transform: rotateX(10deg) rotateZ(36deg);
}
.lines11 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin11 10s linear infinite;
animation: spin11 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(39.6deg);
transform: rotateX(10deg) rotateZ(39.6deg);
}
.lines12 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin12 10s linear infinite;
animation: spin12 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(43.2deg);
transform: rotateX(10deg) rotateZ(43.2deg);
}
.lines13 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin13 10s linear infinite;
animation: spin13 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(46.8deg);
transform: rotateX(10deg) rotateZ(46.8deg);
}
.lines14 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin14 10s linear infinite;
animation: spin14 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(50.4deg);
transform: rotateX(10deg) rotateZ(50.4deg);
}
.lines15 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin15 10s linear infinite;
animation: spin15 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(54deg);
transform: rotateX(10deg) rotateZ(54deg);
}
.lines16 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin16 10s linear infinite;
animation: spin16 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(57.6deg);
transform: rotateX(10deg) rotateZ(57.6deg);
}
.lines17 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin17 10s linear infinite;
animation: spin17 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(61.2deg);
transform: rotateX(10deg) rotateZ(61.2deg);
}
.lines18 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin18 10s linear infinite;
animation: spin18 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(64.8deg);
transform: rotateX(10deg) rotateZ(64.8deg);
}
.lines19 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin19 10s linear infinite;
animation: spin19 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(68.4deg);
transform: rotateX(10deg) rotateZ(68.4deg);
}
.lines20 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin20 10s linear infinite;
animation: spin20 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(72deg);
transform: rotateX(10deg) rotateZ(72deg);
}
.lines21 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin21 10s linear infinite;
animation: spin21 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(75.6deg);
transform: rotateX(10deg) rotateZ(75.6deg);
}
.lines22 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin22 10s linear infinite;
animation: spin22 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(79.2deg);
transform: rotateX(10deg) rotateZ(79.2deg);
}
.lines23 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin23 10s linear infinite;
animation: spin23 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(82.8deg);
transform: rotateX(10deg) rotateZ(82.8deg);
}
.lines24 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin24 10s linear infinite;
animation: spin24 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(86.4deg);
transform: rotateX(10deg) rotateZ(86.4deg);
}
.lines25 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin25 10s linear infinite;
animation: spin25 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(90deg);
transform: rotateX(10deg) rotateZ(90deg);
}
.lines26 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin26 10s linear infinite;
animation: spin26 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(93.6deg);
transform: rotateX(10deg) rotateZ(93.6deg);
}
.lines27 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin27 10s linear infinite;
animation: spin27 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(97.2deg);
transform: rotateX(10deg) rotateZ(97.2deg);
}
.lines28 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin28 10s linear infinite;
animation: spin28 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(100.8deg);
transform: rotateX(10deg) rotateZ(100.8deg);
}
.lines29 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin29 10s linear infinite;
animation: spin29 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(104.4deg);
transform: rotateX(10deg) rotateZ(104.4deg);
}
.lines30 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin30 10s linear infinite;
animation: spin30 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(108deg);
transform: rotateX(10deg) rotateZ(108deg);
}
.lines31 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin31 10s linear infinite;
animation: spin31 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(111.6deg);
transform: rotateX(10deg) rotateZ(111.6deg);
}
.lines32 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin32 10s linear infinite;
animation: spin32 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(115.2deg);
transform: rotateX(10deg) rotateZ(115.2deg);
}
.lines33 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin33 10s linear infinite;
animation: spin33 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(118.8deg);
transform: rotateX(10deg) rotateZ(118.8deg);
}
.lines34 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin34 10s linear infinite;
animation: spin34 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(122.4deg);
transform: rotateX(10deg) rotateZ(122.4deg);
}
.lines35 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin35 10s linear infinite;
animation: spin35 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(126deg);
transform: rotateX(10deg) rotateZ(126deg);
}
.lines36 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin36 10s linear infinite;
animation: spin36 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(129.6deg);
transform: rotateX(10deg) rotateZ(129.6deg);
}
.lines37 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin37 10s linear infinite;
animation: spin37 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(133.2deg);
transform: rotateX(10deg) rotateZ(133.2deg);
}
.lines38 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin38 10s linear infinite;
animation: spin38 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(136.8deg);
transform: rotateX(10deg) rotateZ(136.8deg);
}
.lines39 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin39 10s linear infinite;
animation: spin39 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(140.4deg);
transform: rotateX(10deg) rotateZ(140.4deg);
}
.lines40 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin40 10s linear infinite;
animation: spin40 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(144deg);
transform: rotateX(10deg) rotateZ(144deg);
}
.lines41 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin41 10s linear infinite;
animation: spin41 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(147.6deg);
transform: rotateX(10deg) rotateZ(147.6deg);
}
.lines42 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin42 10s linear infinite;
animation: spin42 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(151.2deg);
transform: rotateX(10deg) rotateZ(151.2deg);
}
.lines43 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin43 10s linear infinite;
animation: spin43 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(154.8deg);
transform: rotateX(10deg) rotateZ(154.8deg);
}
.lines44 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin44 10s linear infinite;
animation: spin44 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(158.4deg);
transform: rotateX(10deg) rotateZ(158.4deg);
}
.lines45 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin45 10s linear infinite;
animation: spin45 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(162deg);
transform: rotateX(10deg) rotateZ(162deg);
}
.lines46 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin46 10s linear infinite;
animation: spin46 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(165.6deg);
transform: rotateX(10deg) rotateZ(165.6deg);
}
.lines47 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin47 10s linear infinite;
animation: spin47 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(169.2deg);
transform: rotateX(10deg) rotateZ(169.2deg);
}
.lines48 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin48 10s linear infinite;
animation: spin48 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(172.8deg);
transform: rotateX(10deg) rotateZ(172.8deg);
}
.lines49 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin49 10s linear infinite;
animation: spin49 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(176.4deg);
transform: rotateX(10deg) rotateZ(176.4deg);
}
.lines50 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin50 10s linear infinite;
animation: spin50 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(180deg);
transform: rotateX(10deg) rotateZ(180deg);
}
.lines51 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin51 10s linear infinite;
animation: spin51 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(183.6deg);
transform: rotateX(10deg) rotateZ(183.6deg);
}
.lines52 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin52 10s linear infinite;
animation: spin52 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(187.2deg);
transform: rotateX(10deg) rotateZ(187.2deg);
}
.lines53 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin53 10s linear infinite;
animation: spin53 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(190.8deg);
transform: rotateX(10deg) rotateZ(190.8deg);
}
.lines54 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin54 10s linear infinite;
animation: spin54 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(194.4deg);
transform: rotateX(10deg) rotateZ(194.4deg);
}
.lines55 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin55 10s linear infinite;
animation: spin55 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(198deg);
transform: rotateX(10deg) rotateZ(198deg);
}
.lines56 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin56 10s linear infinite;
animation: spin56 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(201.6deg);
transform: rotateX(10deg) rotateZ(201.6deg);
}
.lines57 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin57 10s linear infinite;
animation: spin57 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(205.2deg);
transform: rotateX(10deg) rotateZ(205.2deg);
}
.lines58 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin58 10s linear infinite;
animation: spin58 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(208.8deg);
transform: rotateX(10deg) rotateZ(208.8deg);
}
.lines59 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin59 10s linear infinite;
animation: spin59 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(212.4deg);
transform: rotateX(10deg) rotateZ(212.4deg);
}
.lines60 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin60 10s linear infinite;
animation: spin60 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(216deg);
transform: rotateX(10deg) rotateZ(216deg);
}
.lines61 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin61 10s linear infinite;
animation: spin61 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(219.6deg);
transform: rotateX(10deg) rotateZ(219.6deg);
}
.lines62 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin62 10s linear infinite;
animation: spin62 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(223.2deg);
transform: rotateX(10deg) rotateZ(223.2deg);
}
.lines63 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin63 10s linear infinite;
animation: spin63 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(226.8deg);
transform: rotateX(10deg) rotateZ(226.8deg);
}
.lines64 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin64 10s linear infinite;
animation: spin64 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(230.4deg);
transform: rotateX(10deg) rotateZ(230.4deg);
}
.lines65 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin65 10s linear infinite;
animation: spin65 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(234deg);
transform: rotateX(10deg) rotateZ(234deg);
}
.lines66 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin66 10s linear infinite;
animation: spin66 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(237.6deg);
transform: rotateX(10deg) rotateZ(237.6deg);
}
.lines67 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin67 10s linear infinite;
animation: spin67 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(241.2deg);
transform: rotateX(10deg) rotateZ(241.2deg);
}
.lines68 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin68 10s linear infinite;
animation: spin68 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(244.8deg);
transform: rotateX(10deg) rotateZ(244.8deg);
}
.lines69 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin69 10s linear infinite;
animation: spin69 10s linear infinite;
-webkit-transform: rotateX(10deg) rotateZ(248.4deg);
transform: rotateX(10deg) rotateZ(248.4deg);
}
.lines70 {
width: 200%;
height: 10px;
background-image: radial-gradient(circle at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, #ffffff 100%);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-animation: spin70 10s linear infinite;
animation: spin70 10s linear infinite;
-w.........完整代码请登录后点击上方下载按钮下载查看
热门代码搜索
其他语言代码库
Html代码库
Python代码库
Java代码库
Php代码库
Phpcli代码库
Golang代码库
C#代码库
Nodejs代码库
C代码库
C++代码库
Sql代码库
R代码库
Rust代码库
Ruby代码库
Dart代码库
Vb代码库
D代码库
F#代码库
Typescript代码库
Coffeescript代码库
Julia代码库
Kotlin代码库
Perl代码库
Groovy代码库
Lua代码库
Vala代码库
Ocaml代码库
Assembly代码库
Objectc代码库
Scala代码库
Erlang代码库
Pascal代码库
Swift代码库
Fortran代码库
Bash代码库
Clojure代码库
Ada代码库
Elixir代码库
Cobol代码库
Haskell代码库
Nim代码库
Racket代码库
Lisp代码库
网友评论0