más que HTML desarrollo web con estándares
Frameworks de desarrollo rápido de CSS
Los frameworks CSS más conocidos, como Blueprint, YUI o 960, nos proporcionan una serie de clases con estilos predefinidos que podemos aplicar. En cambio existen otros frameworks CSS enfocados en simplificar y agilizar el desarrollo de nuestras propias hojas de estilo.
Algunos de ellos son:
Todos tienen una sintaxis similar, aunque con pequeñas peculiaridades. Las características comunes y principales de todos ellos son:
Selectores anidados
En lugar de:
body { color: grey; }
body h1 { color: green; }
body h1 a { color: red; }
Podemos usar:
body { color: grey;
h1 { color: green;
a { color: red; }
}
}
Constantes (y operaciones con éstas)
En lugar de:
body { font-size: 15px; }
h1 { font-size: 30px; }
Podemos usar:
@constants { tamano = 15; }
body { font-size: !tamano px; }
h1 { font-size: #[!tamano*2] px; }
Extender clases
En lugar de:
p { border: 1px solid red; padding: 5px; }
Podemos usar:
=error(!c) { border: 1px solid !c; padding: 5px; }
p { +error(red); }
La sintaxis de los ejemplos es la de Scaffold, pero los otros frameworks tienen una sintaxis muy similar.
A continuación, un par de vídeos con explicaciones más a fondo de 2 de los frameworks.
Scaffold
Compass
Comentarios
Los comentarios están cerrados.