0 FPS
Función CSS : ellipse
La web está en segundo plano, animación en pausa.
Cargando animación...
Esta función recorta el área visible del objeto al tamaño del elipse especificado.
Solo se puede utilizar en la propiedad clip-path.
Sintaxis
Animación
ellipse( radioX RadioY [ at X Y ] );
Los radios deben ser un valor positivo utilizando cualquier tipo de unidad de tamaño relativa válida.
Las coordenadas de inicio son opcionales, y se pueden especificar con cualquier tipo de unidad de tamaño relativo válido, tanto positivo como negativo.
Para más información sobre unidades de tamaño relativo, consulta la Referencia CSS : Unidades.
Por ejemplo podéis ver los pasos de la animación de la derecha :
1
2
3
4
5
clip-path:ellipse(10% 5%); /* 10% de radio X, 5% de radio Y */clip-path:ellipse(120% 30%); /* 120% de radio X, 30% de radio Y */clip-path:ellipse(80% 150% at 0% 50%); /* 80% de radio X, 150% de radio Y, 0% posición X, 50% posición Y */clip-path:ellipse(70% 50% at 100% 20px); /* 70% de radio X, 50% de radio Y, 100% posición X, 20 píxeles posición Y */clip-path:ellipse(100px 60% at 50% 150px); /* 100 píxeles de radio X, 60% de radio Y, 50% posición X, 150 píxeles posición Y */
Código de ejemplo
Compatibilidad
Esta propiedad es soportada por todos los navegadores compatibles con CSS.
Soportado a partir de la versión 24 | |
Soportado a partir de la versión 3.5 | |
Soportado a partir de la versión 12 | |
NO soportado | |
NO soportado |
Documento modificado por última vez : 30/12/2020
Ejemplo modificado por última vez : 30/12/2020
Ejemplo modificado por última vez : 30/12/2020