Estilos con CSS — Informática, 11–13
CSS controla el aspecto de una página web sin cambiar su contenido principal. Aprendes a separar el significado de la apariencia y después defines colores, espacios, tamaños y distribución mediante reglas.
Contenido y apariencia
Una página web tiene contenido, como un título o un párrafo, y también puede tener un estilo visual. CSS contiene instrucciones que indican cómo deben verse algunos elementos: texto azul, un margen amplio o dos columnas. La página puede mantener el mismo mensaje mientras cambia su estilo.
¿Por qué separar el estilo?
Si cada página mezclara sus palabras con todas las instrucciones visuales, cambiar un color o corregir la distribución obligaría a editar muchos lugares. CSS nació para dar un estilo coherente a varias páginas y actualizarlas con más facilidad. También permite adaptar el mismo contenido a un móvil, una pantalla grande o una impresora.
Poner azul un título
Imagina que una página tiene un título marcado como título. Primero, eliges ese tipo de elemento como objetivo. Después, estableces el color del texto en azul y el tamaño en 24 píxeles. Cuando el navegador carga la página, todos los títulos que coinciden reciben esos ajustes. Cambias la regla una vez y todos cambian juntos.
La trampa de confundir estilo y contenido
Es tentador usar el tamaño o el color para decidir qué significa algo, porque primero notamos el aspecto. Así una página puede parecer correcta, pero su estructura queda poco clara para los navegadores y las tecnologías de asistencia. Marca cada elemento por lo que es y usa CSS para decidir cómo debe verse.
CSS en sitios reales
Los sitios web cotidianos usan CSS para texto legible, menús, tarjetas, espacios y diseños que caben en pantallas distintas. Una tienda puede conservar la misma información del producto y cambiar su aspecto para un móvil o un ordenador. CSS no inventa datos ni da sentido a una imagen mala; organiza la presentación.
Sigue explorando
Otros idiomas
Cargando MyLeoNes™…