Cómo definir el punto central de rotación de la animación en css3

1. Primero cree un nuevo documento html5 y complete la escritura del código básico, como se muestra en la siguiente figura.

2. Luego crea una nueva capa rectangular con una longitud de 100 píxeles y una altura de 50 píxeles con un fondo rojo.

3. Luego, establezca la capa rectangular en una elipse ingresando el atributo "border-radius:50%/50%", como se muestra en la siguiente imagen.

4. El siguiente paso es rotar la elipse. Utilice "transform:rotate(30deg)" para rotar la elipse 30 grados.

5. De esta manera, la elipse se gira usando css3 y la vista previa se completa como se muestra en la siguiente figura.