Simplificación en CSS con variables
Hoy aprendí una nueva técnica para hacer nuestras hojas de estilo mucho más simple y fácil de modificar, realmente siempre había visto el uso de la técnica de variables pero nunca lo entendí, así que se los explico:
La primera columna tiene por supuesto dos estilos CSS, en la segunda hay una variable
@brand-color:#4D926F;
La variable funciona de forma similar que en la programación, una vez que declaramos @ más un nombre cualquiera y le asignamos un valor es posible que en nuestros estilos en vez de volver a escribir el valor una y otra vez, pongamos nuestra variable y cuando deseemos modificar el valor, modificamos el valor de la variable, la imagen lo explica mejor que yo.
En este ejemplo se ve claramente otro tipo de simplificación, se trata de meter dentro de un estilo otro estilo, simplificando lo que en la primera columna aparece: un estilo y otro estilo derivado del primero, en ligar de eso en el estilo primario se mete el secundario y listo.
Vía wwwhat’snew
Posts relacionados
