<!DOCTYPE html> <html> <head> <style> .ball{ text-indent:1px; width:70px; height:70px; background-color:green; border-radius:50%; position:absolute; right:0%; bottom:0%; text-align:center; color:white; animation:ballmove 8s 1; -webkit-animation:ballmove 8s 1; } @keyframes ballmove{ 0%{ transform:rotateZ(-360deg); top:0%; right:93%; } 12.5%{ right:93%; top:82%; } } @-webkit-keyframes ballmove{ 0%{ -wbkit-transform:rotateZ(-360deg); top:0%; right:93%; } 12.5%{ right:93%; top:82%; } } </style> </head> <body> <div class="ball"> <p>Web4CSS</p> </div> </body> </html>
Run
×
Share