Saltar a contenido

CSS

CSS, por sus siglas en inglés de Hoja de Estilo en Cascada, es el lenguaje de estilos utilizado para describir la presentación de documentos HTML. CSS describe como debe ser renderizado el elemento estructurado en la pantalla, en papel, o en el habla o en otros medios.1

Datos rápidos

  • Es el mecanismo para insertar estilo en las páginas webs.
  • El estilo se refiere a colores, formatos, posicionamiento, etc. (e incluso animaciones) de los elementos en la página.
  • Posibilita la separación de contenidos y presentación en una página web, siendo en la actualidad una recomendación de W3C.

Estructura Básica

Toda regla de estilo incluida en una hoja de estilos consta de dos partes:

  • Un selector: especifica que elementos se ven afectados.
  • La declaración: uno (o más) pares de propiedad-valor, que especifican los cambios de estilo.
h1 { /* (1) */
    color: red; /* (2) */
    background: yellow;
}
  1. h1 hace referencia al selector, y las llaves abren el inicio de la declaración.
  2. color es la propiedad a afectar (el color del texto en este caso) y red es el valor (rojo).

En CSS, hay 3 formas distintas de aplicar los estilos a los elementos HTML:

  • Usando el atributo style de cualquier elemento HTML (en este caso no hay selector).
  • Usando hojas de estilo internas.
  • Usando hojas de estilo externas, importándolas o bien en el HTML o en otras hojas CSS.

Hoja de estilos en cascada

Por norma general, los cambios que afectan a un elemento afectarán y se propagarán a los hijo.

  1. Tomado de CSS: Hojas de estilo en cascada, de MDN Web Docs. ↩

Última actualización: 13 de febrero de 2022