CSSPropiedades personalizadas (variables)


Introducción

Las Variables CSS permiten a los autores crear valores reutilizables que se pueden usar en un documento CSS.

Por ejemplo, es común en CSS reutilizar un solo color a lo largo de un documento. Antes de las Variables CSS, esto significaría reutilizar el mismo valor de color muchas veces en un documento. Con las Variables CSS, el valor del color se puede asignar a una variable y se puede hacer referencia en varios lugares. Esto facilita el cambio de valores y es más semántico que el uso de valores CSS tradicionales.

Sintaxis

  • : pseudo-clase raíz {} / * que permite una definición más global de las variables * /
  • --nombre-variable: valor ; / * Definir variable * /
  • var (- nombre-variable, valor predeterminado ) / * usa la variable definida con un valor predeterminado de reserva * /

Observaciones

Las variables CSS son actualmente consideradas una tecnología experimental.


APOYO / COMPATIBILIDAD DEL NAVEGADOR

Firefox: Versión 31 + (Habilitado de forma predeterminada)

Más información de Mozilla

Chrome: Versión 49 + (habilitada por defecto) .

"Esta función se puede habilitar en Chrome Versión 48 para realizar pruebas al habilitar la función de experimental Web Platform . Ingrese chrome://flags/ en su barra de direcciones de Chrome para acceder a esta configuración".

IE: No es compatible.

Edge: En desarrollo

Safari: Versión 9.1+

Propiedades personalizadas (variables) Ejemplos relacionados