Uno de los principios básicos del desarrollo web (o de cualquier tipo de aplicación) es la separación de intereses, y, más concretamente, la separación de la estructura del documento (HTML), la funcionalidad (JavaScript) y la presentación (CSS). (Esto no siempre ha sido así, en un principio el lenguaje HTML se encargaba tanto de la estructura como de la presentación, todo en una misma sopa).
Las hojas de estilo CSS permiten dejar que el lenguaje HTML se encargue exclusivamente de declarar la estructura del documento (tendrá una cabecera con esta imagen, también el título «El Principito» y dos secciones, con estos tres párrafos cada una, un menú de navegación, y también un pié de página…).
Posteriormente podremos enlazar este HTML a una hoja de estilo externa, escrita en lenguaje CSS, que describirá en todo detalle cómo se presentará cada uno de estos elementos (el texto será sans-serif , el tamaño de la letra será de 16 píxeles, la cabecera será azul y medirá 128 píxeles, el menú quedará fijo a la izquierda, la separación entre párrafos será del doble del tamaño de la letra…).
En esta sección encontrarás técnicas y conceptos útiles para sacarle todo el partido posible a este lenguaje, con los mínimos dolores de cabeza.
- Cómo se calcula la precedencia de los estilos CSS
- Herencia en CSS { todo lo que necesitas saber }
- Cómo crear botones CSS elegantes y accesibles