1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <style> 6 div{ 7 width: 100px; 8 height: 100px; 9 position: relative; 10 animation: firstdiv 2s linear 1s infinite alternate; 11 } 12 @keyframes firstdiv{ 13 0%{top:0;left:0;background-color: greenyellow;} 14 25%{top:0;left:100px;background-color: green;} 15 50%{top:100px;left:100px;background-color: yellow;} 16 75%{top:100px;left:0;background-color: gold;} 17 100%{top:0;left:0;background-color: greenyellow;} 18 19 } 20 </style> 21 </head> 22 <body> 23 <div></div> 24 </body> 25 </html>