¿Qué es CSS?

Casi todas las páginas que has visto en un navegador usan CSS para definir su apariencia. Es una de las tres tecnologías fundamentales de la web, junto con HTML para la estructura y JavaScript para el comportamiento. El W3C lo mantiene como estándar abierto. Los navegadores leen reglas de CSS, texto sin formato como p { color: navy; }, y las aplican a los elementos HTML de la página.

¿Qué significa «en cascada» en CSS?

La «cascada» es el algoritmo que sigue el navegador cuando varias declaraciones se dirigen al mismo elemento, ya procedan de los estilos predeterminados, del sitio o de la configuración del lector. Primero descarta las que no son pertinentes y después las compara por origen e importancia, especificidad, proximidad del ámbito y orden de aparición. Cuando las demás condiciones coinciden, un selector más específico supera a uno general; si también empatan en especificidad, gana la declaración que aparece después. Por eso una regla añadida después de la hoja de estilo de un tema solo puede reemplazarla si no pierde en una etapa anterior.

¿Cómo se añade CSS a una página?

Hay tres formas, como muestra el diagrama anterior. Las hojas de estilo externas guardan todo el CSS en un archivo .css independiente al que pueden enlazarse muchas páginas. Es la opción habitual: un archivo controla todo el sitio y el navegador puede almacenarlo en caché. Los estilos internos se escriben dentro de un bloque <style> del HTML y solo afectan a esa página. Los estilos en línea se incluyen en el atributo style de un elemento; conviene reservarlos para pruebas rápidas y excepciones puntuales.

¿Qué puede hacer CSS hoy?

Mucho más que definir colores y fuentes. CSS moderno organiza la página con flexbox y grid. Las consultas de medios adaptan el diseño a cualquier tamaño de pantalla. Las transiciones y animaciones funcionan sin JavaScript. Las propiedades personalizadas, también llamadas variables, permiten definir una vez los colores y espacios del sitio y reutilizarlos. Efectos que antes requerían scripts o imágenes, como degradados, sombras y esquinas redondeadas, ahora pueden resolverse con una línea de CSS cada uno.