| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <style> | |
| .box { | |
| height: 80px; | |
| width: 80px; | |
| background-color: red; | |
| animation-name: animation; | |
| animation-duration: 1000000000s; | |
| animation-delay: -250000000s; | |
| animation-timing-function: linear; | |
| } | |
| .test { | |
| height: 80px; | |
| width: 80px; | |
| perspective: 250px; | |
| border: 1px solid black; | |
| background: green; | |
| } | |
| @keyframes animation { | |
| 0% { transform: rotateY(0); } | |
| 100% { transform: rotateY(-1turn); } | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <div class="test"> | |
| <div class="inner box"> | |
| </div> | |
| </div> | |
| </body> | |
| </html> |