33 lines
617 B
HTML
33 lines
617 B
HTML
|
<style>
|
||
|
|
|
||
|
|
div {
|
||
|
|
position: absolute;
|
||
|
|
top: 0;
|
||
|
|
left: 0;
|
||
|
|
height: 100px;
|
||
|
|
width: 100px;
|
||
|
|
background-color: black;
|
||
|
|
|
||
|
|
translate: 100px 100px;
|
||
|
|
animation: rotate calc(24 * 60 * 60 * 1s);
|
||
|
|
}
|
||
|
|
|
||
|
|
div::after {
|
||
|
|
content: "";
|
||
|
|
position: absolute;
|
||
|
|
top: 0;
|
||
|
|
left: 0;
|
||
|
|
width: 50%;
|
||
|
|
height: 50%;
|
||
|
|
background-color: gray;
|
||
|
|
}
|
||
|
|
|
||
|
|
@keyframes rotate {
|
||
|
|
0% { rotate: 180deg; }
|
||
|
|
100% { rotate: 180deg; }
|
||
|
|
}
|
||
|
|
|
||
|
|
</style>
|
||
|
|
<div></div>
|
||
|
|
<script src="resources/wait-until-animations-are-committed.js"></script>
|