svg+css实现可爱小猫咪送信通知消息效果代码-html代码-BFW代码库

svg+css实现可爱小猫咪送信通知消息效果代码

代码语言：html

代码描述：svg+css实现可爱小猫咪送信通知消息效果代码，小猫咪手拿信件，左边耳朵上有消息数量显示，砸一砸眼睛。

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

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">




    <style>
        * {
            margin: 0;
            padding: 0;
        }
        .container {
            width: 100vw;
            height: 100vh;
            background: #8C858E;
        }
        
        #left-eye, #right-eye {
              animation: open-eye 2s infinite forwards;
              animation-delay: 2s;
              opacity: 0;
        }
        
        #letter, #rigth-arm {
          animation: move 3s infinite alternate ease-in-out;
           animation-delay: 2s;
        }
        
        @keyframes open-eye {
          50% {
            opacity: 0;
          }
           55% {
            opacity: 0.9;
          }
          60% {
            opacity: 1;
          }
          100% {
            opacity: 1;
          }
        }
           
        @keyframes move {
          to {
          transform: rotate(3deg);
          }
          }
    </style>


</head&g.........完整代码请登录后点击上方下载按钮下载查看