I. CSS (hojas de estilo en cascada)

3. Maneras de incluir los estilos CSS

3.2. CSS en la cabecera de nuestro documento

Vamos a hacer que los párrafos de nuestra página sean de color rojo:

<!DOCTYPE html>
<html>
    <head>
        <title>Mi página</title>
        <style>
            p {
                color : red;
            }
        </style>
    </head>
    <body>
        <p>Soy un párrafo de prueba.</p>
    </body>
</html>

Dentro de la etiqueta HEAD, en nuestra página, hemos incluido una etiqueta <style type=”text/css”>, y ahí hemos incluido nuestras definiciones. De momento, no vamos a preocuparnos de la sintaxis; solo del funcionamiento (de la forma de incluir los CSS).

Si hemos dicho “que los párrafos sean de color rojo”, y lo hemos definido para toda la página (dentro de HEAD), todos los párrafos de la página serán de color rojo, salvo que digamos lo contrario para algunos párrafos en concreto: “que todos los párrafos sean rojos, excepto los que están dentro de la capa con el identificador news, que serán de color azul”. Ya veremos cómo hacerlo.

Ventaja de hacerlo así: podemos definir la apariencia de todos los párrafos (o de cualquier otro elemento) de nuestra página sin necesidad de definir el color en cada uno de ellos. Hacemos una sola definición, y esta afecta a todos los párrafos de la página.