[SOLUCIONADO] Variables o constantes con CSS

[gersveo]

Buenas... Revisando unas cosas sobre boostrap me encontré con que usan algo parecido a unas variables... bueno... yo lo llamo así...

@screen-xs-max: 767px;
@screen-sm-min: 768px;
@screen-sm-max: 991px;
@screen-md-min: 992px;
@screen-md-max: 1199px;
@screen-lg-min: 1200px;

y las usan así...

Código CSS:

@media(max-width: @screen-xs-max) {
 
}
 
@media(min-width: @screen-sm-min) {
 
}
 
@media(min-width: @screen-sm-min) and (max-width: @screen-sm-max) {
 
}
 
@media(min-width: @screen-md-min) {
 
}
 
@media(min-width: @screen-md-min) and (max-width: @screen-md-max) {
 
}
 
@media(min-width: @screen-lg-min) {
 
}
 

he buscado por internet como se declaran esas variables... pero nada... no lo he logrado...
Se me ocurrió crear un color para una plantilla... y para no estar escribiendo el código del color pensé en usar una variable... y si cambiaba el color solo era modificar una línea...

alguien me puede dar luz sobre este tema...?

[fede5426]

Seguro tenian un simbolo @ las variables?

Nunca lo había visto asi, pero si conozco que por ejemplo con Sass y Stylus se pueden crear variables para no repetir el código y poder cambiar todo desde una sola linea.

[pzin]

Existen preprocesadores para CSS. Los más famosos son SASS, Less y Stylus. Tienes desde variables, funciones, bucles y muchas más cosas. A mi me gusta más SASS, y es lo que suelo usar.

Lo importante para hacerte una idea, es que no se ejecutan en el navegador. Son herramientas para el desarrollo. Lo que luego se compila es CSS normal y corriente. Hay formas para hacer que se ejecuten según la petición, pero es una guarrada que yo no recomiendo, porque es totalmente innecesario.

En CSS puro, están ya poniendo variables también. Pero una vez que empieces a usar algún preprocesador, te va a parecer poco interesante usar CSS normal.

Para HTML también tienes cosas así. Slim está muy bien. Y para JavaScript, tienes CoffeeScript.

[gersveo]

Gracias... pzin y fede5426
voy a revisar...