Ask for this kind of halo css animation

clipboard.png
ask for such halo css animation

Css
Mar.10,2021

Animation is not limited to static styles. 

background: -webkit-radial-gradient(
        rgba(255,0,0,1) 0px,
        rgba(255,0,0,1) 10px, 
        rgba(255,0,0,.8) 10px,
        rgba(255,0,0,.6) 20px,
        rgba(255,0,0,1) 20px,
        rgba(255,0,0,1) 22px,
        rgba(255,0,0,.7) 22px,
        rgba(255,0,0,.7) 60px,
        rgba(255,0,0,1) 60px,
        rgba(255,0,0,1) 62px,
        rgba(255,0,0,.7) 62px,
        rgba(255,0,0,.5) 100px,
        rgba(255,0,0,1) 100px,
        rgba(255,0,0,1) 102px,
        rgba(255,0,0,.3) 102px,
        rgba(255,0,0,.3) 110px,
        rgba(255,0,0,1) 110px,
        rgba(255,0,0,1) 112px,
        rgba(255,0,0,.3) 112px,
        white 120px,
        white);

https://jsfiddle.net/3L6q0w5L/

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

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <style>
        .common {
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 50%;
            border: 1px solid red;
        }

        .one {
            -moz-animation: sunny 10s linear infinite;
            -ms-animation: sunny 10s linear infinite;
            -webkit-animation: sunny 10s linear infinite;
            animation: sunny 10s linear infinite;
            width: 200px;
            height: 200px;
            box-shadow: 0 0 20px 5px blue;
        }

        .two {
            width: 80%;
            height: 80%;
            box-shadow: 0 0 20px 5px blue;
        }

        .three {
            width: 60%;
            height: 60%;
            box-shadow: 0 0 20px 8px blue;
        }

        .four {
            width: 40%;
            height: 40%;
            box-shadow: 0 0 20px 5px blue;
        }

        .five {
            width: 20%;
            height: 20%;
            background-color: red;
            box-shadow: 0 0 20px 5px blue;
        }

        @-webkit-keyframes sunny {
            0% {
                width: 200px;
                height: 200px;
            }
            50% {
                width: 100px;
                height: 100px;
            }
            100%{
                width: 200px;
                height: 200px;
            }
        }
        @keyframes sunny {
            0% {
                width: 200px;
                height: 200px;
            }
            50% {
                width: 100px;
                height: 100px;
            }
            100%{
                width: 200px;
                height: 200px;
            }
        }
    </style>
</head>

<body>
    <div class="one common">
        <div class="two common">
            <div class="three common">
                <div class="four common">
                    <div class="five common"></div>
                </div>
            </div>
        </div>
    </div>
</body>

</html>

try it?

Previous: Model not updating until space is pressed on Android

Next: Ask for help from springboot jpa to package and deploy on the server, insert Datagram error, no problem locally

css mysql arrays josn react html typescript webpack npm sass R objective-c .net sql-server jquery python-3.x angularjs django angular excel regex iphone ajax linux xml pandas vba spring database wordpress string wpf xcode windows bash postgresql oracle multithreading eclipse list firebase algorithm macos forms image scala visual-studio azure bootstrap spring-boot react-native python-2.7 docker performance function winforms matlab powershell apache dataframe api sqlite numpy rest shell selenium flutter dart maven loops qt swing android-studio csv express file class tensorflow sorting codeigniter perl
MySQL Query : SELECT * FROM `codeshelper`.`v9_news` WHERE status=99 AND catid='6' ORDER BY rand() LIMIT 5
MySQL Error : Disk full (/tmp/#sql-temptable-64f5-1b3b04a-2c268.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
MySQL Errno : 1021
Message : Disk full (/tmp/#sql-temptable-64f5-1b3b04a-2c268.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
Need Help?