Using pure CSS3 to achieve circular dispersion from the center to the surrounding animation effect code

Let's start with a simple example, for example:

@keyframes Hovertreemove
{
from {top:30px;}
to {top:130px;}
}

Effect:
Http://hovertree.com/texiao/css3/37/1.htm

You can create animations by @keyframes rules.

The animation is created by gradually changing one set of CSS styles to another.
You can change this set of CSS styles several times during the animation process.
The time at which the change occurs is specified as a percentage, or by the keyword "from" and "to", equivalent to 0% and 100%.
0% is the start time of the animation, and the end time of the 100% animation.
For best browser support, you should always define the 0% and 100% selectors.

Here's the code for up and down motion:

<! DOCTYPE html>
The following is the code for the circular diffusion motion:

 
 
 

<! DOCTYPE html>