css实现抖音logo标识悬浮抖动动画效果代码-html代码-BFW代码库

css实现抖音logo标识悬浮抖动动画效果代码

代码语言：html

所属分类：动画

代码描述：css实现抖音logo标识悬浮抖动动画效果代码

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

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">



    <style>
        .tik-tok {
          width: 250px;
          aspect-ratio: .87;
          display: grid;
          cursor: pointer;
          isolation: isolate;
        }
        .tik-tok:before, 
        .tik-tok:after {
          content: "";
          grid-area: 1/1;
          transform: translate(calc(.2*var(--_h,0%) - 3%),calc(var(--_h,0%) - 3%));
          background: 
            radial-gradient(100% 100% at 100% 100%,#0000 0 50%,var(--c,#08fff9) 51.5% 99%,#0000 ) 0 52.5%/41% 36% no-repeat,
            radial-gradient(50% 100% at top,#0000 44%,var(--c,#08fff9) 45% 98%,#0000 )0 100%/73% 31% no-repeat,
            linear-gradient(var(--c,#08fff9) 0 0) 66% 0/20% 70% no-repeat,
            radial-gradient(100% 100% at 100% 0,#0000 0 58%,var(--c,#08fff9) 58.5% 99%,#0000 ) 1.........完整代码请登录后点击上方下载按钮下载查看