css布局实现霓虹灯文字闪烁动画效果代码

代码语言:html

所属分类:动画

代码描述:css布局实现霓虹灯文字闪烁动画效果代码

代码标签: 霓虹灯 文字 闪烁 动画 效果

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

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">


    <link href="https://fonts.googleapis.com/css2?family=Dosis:wght@800&display=swap" rel="stylesheet">




    <style>
        html {
          --color: red;
          display: grid;
          place-items:center;
          min-height: 100vh;
          font-family: 'Dosis', monospace;
          font-weight: 900;
          font-size: 10vw;
          text-align: center;
          background: radial-gradient(circle, var(--color) 2px, #111 2px);
          background-size: 20px 20px;
          color: #111;
          text-shadow:
            0 0 1px gold,
            0 0 1px gold,
            0 0 1px gold,
            0 0 1px gold,
            0 0 1px gold,
            0 0 10px black;
          perspective: 600px;
          animation: colorSwap 2s linear infinit.........完整代码请登录后点击上方下载按钮下载查看

网友评论0