css实现光晕背景动画效果代码-html代码-BFW代码库

css实现光晕背景动画效果代码

代码语言：html

所属分类：动画

代码描述：css实现光晕背景动画效果代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en" >
<head>
  <meta charset="UTF-8">
<style>
    body {
  margin: 0;
  overflow: hidden;
}

.background {
  width: 100vw;
  height: 100vh;
  background: #3E1E68;
}

.background span {
  width: 20vmin;
  height: 20vmin;
  border-radius: 20vmin;
  backface-visibility: hidden;
  position: absolute;
  animation-name: move;
  animation-duration: 6s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
}
.background span:nth-child(1) {
  color: #E45A84;
  top: 38%;
  left: 90%;
  animation-duration: 14.4s;
  animation-delay: -7.3s;
  transform-origin: 8vw -20vh;
  box-shadow: 40vmin 0 7.5825118355vmin currentColor;
}
.background span:nth-child(2) {
  color: #E45A84;
  top: 85%;
  left: 44%;
  animation-duration: 13.9s;
  animation-delay: -15.3s;
  transform-origin: -23vw 19vh;
  box-shadow: -40vmin 0 7.0535658472vmin currentColor;
}
.ba.........完整代码请登录后点击上方下载按钮下载查看