crop_rotate
Run
<!DOCTYPE html> <html> <head> <style> div { width: 100px; height: 100px; background-color: blue; animation-name: move; animation-duration: 4s; } @keyframes move { from {background-color: blue;} to {background-color: skyblue;} } </style> </head> <body> <h1>CSS Animation</h1> <p>CSS Animation element witll move from left 0 to left 150</p> <div></div> </body> </html>
PCFET0NUWVBFIGh0bWw+DQo8aHRtbD4NCjxoZWFkPg0KPHN0eWxlPiANCmRpdg0Kew0KICB3aWR0aDogMTAwcHg7DQogIGhlaWdodDogMTAwcHg7DQogIGJhY2tncm91bmQtY29sb3I6IGJsdWU7DQogIGFuaW1hdGlvbi1uYW1lOiBtb3ZlOw0KICBhbmltYXRpb24tZHVyYXRpb246IDRzOw0KfQ0KDQpAa2V5ZnJhbWVzIG1vdmUNCnsNCiAgZnJvbSB7YmFja2dyb3VuZC1jb2xvcjogYmx1ZTt9DQogIHRvIHtiYWNrZ3JvdW5kLWNvbG9yOiBza3libHVlO30NCn0NCjwvc3R5bGU+DQo8c3R5bGUgdHlwZT0idGV4dC9jc3MiPiA6Oi13ZWJraXQtc2Nyb2xsYmFye3dpZHRoOjdweDtoZWlnaHQ6N3B4O306Oi13ZWJraXQtc2Nyb2xsYmFyLXRyYWNre2JhY2tncm91bmQ6I2ZmZjt9Ojotd2Via2l0LXNjcm9sbGJhci10aHVtYntib3JkZXItcmFkaXVzOjVweDtiYWNrZ3JvdW5kOiMyZjQ1ZmY7fTwvc3R5bGU+PC9oZWFkPg0KPGJvZHk+DQoNCjxoMT5DU1MgQW5pbWF0aW9uPC9oMT4NCjxwPkNTUyBBbmltYXRpb24gZWxlbWVudCB3aXRsbCBtb3ZlIGZyb20gbGVmdCAwIHRvIGxlZnQgMTUwPC9wPg0KPGRpdj48L2Rpdj4NCg0KPC9ib2R5Pg0KPC9odG1sPg==