CSS (hojas de estilo en cascada)

4. Sintaxis CSS

La sintaxis es siempre igual:

selector {
    atributo : valor;
}

Escribimos el elemento cuya apariencia queremos modificar (el selector: "párrafo", por ejemplo), abrimos llaves, escribimos la propiedad que queremos modificar (el atributo: "color", por ejemplo) seguida de dos puntos, y escribimos el valor que queremos que tenga ("red" – rojo -, por ejemplo), después escribimos punto y coma, para separar una definición de otra, y cerramos llaves.

Ejemplo:

p {
    color : red;
}

Eso significa que los párrafos ("p") serán de color rojo.

En algunos casos, los valores irán acompañados de unidades.

p {
    font-size : 15px;
}

Eso significa que los párrafos tendrán un tamaño de letra de 15 píxeles.

Las definiciones se pueden combinar:

p {
    color : red;
    font-size : 15px;
}

Los párrafos serán de color rojo y tendrán un tamaño de letra de 15 píxeles. Como vemos, hemos separado ambas definiciones mediante punto y coma (el último punto y coma es prescindible, porque no hay una definición posterior, pero no pasa nada si lo dejamos).

Además, varios elementos pueden compartir definiciones (separamos los elementos con coma):

p, ul {
    color : green;
}

Los párrafos y las listas no ordenadas (“ul”, no las ordenadas: “ol”) tendrán color verde.

Los comentarios en CSS se hacen así:

/* Contenido del comentario */

Podemos incluir comentarios entre nuestras reglas CSS para saber mejor a qué elementos hacen referencia. Los comentarios no tendrán ningún efecto sobre la apariencia.