-webkit-box-reflect
No estándar: Esta función no está estandarizada. No recomendamos usar funciones no estándar en producción, ya que tienen un soporte limitado en los navegadores y pueden cambiar o eliminarse. Sin embargo, pueden ser una alternativa adecuada en casos específicos donde no exista una opción estándar.
Resumen
La propiedad
CSS -webkit-box-reflect
permite reflejar el contenido del elemento en una dirección específica.
Advertencia: Nota: Esta característica no está pensada para ser usada en páginas Web .Para conseguir reflexión en la Web, la forma estándar es usando la función CSS element()
.
Valor inicial | none |
---|---|
Applies to | all elements |
Heredable | no |
Valor calculado | como se especifica |
Animation type | discrete |
Síntaxis
/* Valores para la dirección */
-webkit-box-reflect: above;
-webkit-box-reflect: below;
-webkit-box-reflect: left;
-webkit-box-reflect: right;
/* Valor del desplazamiento */
-webkit-box-reflect: below 10px;
/* Valor de máscara */
-webkit-box-reflect: below 0 linear-gradient(transparent, white);
/* Valores globales */
-webkit-box-reflect: inherit;
-webkit-box-reflect: initial;
-webkit-box-reflect: unset;
Valores
above
,below
,right
,left
-
Son palabras clave que indican en qué dirección se realiza la reflexión.
<length>
-
Indica el tamaño de la reflexión.
<image>
-
Describe la máscara que se aplicará a la reflexión.
Síntaxis Formal
Especificaciones
Esta propiedad no está entre los objetivos de la especificación estándar y no será parte de CSS. La manera estándar para conseguir reflexión en CSS es el uso de la función element()
.
Compatibilidad con navegadores
Ver además
- La documentación de Apple.
- La especificación de Webkit.
- El artículo de Lea Verou sobre reflexión usando característica CSS que están en el estándar.