js+css实现随机催眠隧道动画效果代码

代码语言:html

所属分类:动画

代码描述:js+css实现随机催眠隧道动画效果代码

代码标签: js css 随机 催眠 隧道 动画

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

<!DOCTYPE html>
<html lang="en" >

<head>
  <meta charset="UTF-8">

  
  
<style>
body {
  all: unset;
  background-color: var(--bg);
}
ul {
  all: unset;
  animation: hypno 10s linear infinite alternate-reverse;
  container-type: inline-size;
  display: grid;
  place-content: center;
  & li {
    aspect-ratio: 1 / 1;
    background-color: var(--bg);
    border-radius: 25%;
    grid-area: 1 / 1;
    list-style: none;
    margin: auto;
    width: var(--w);
  }
}
@keyframes hypno {
  100% { 
    rotate: 360deg;
    scale: 3;
  }
}
</styl.........完整代码请登录后点击上方下载按钮下载查看

网友评论0