Índice

Dos ejemplos de formato de los contenedores con CSS

Terminaremos este capítulo viendo dos ejemplos rápidos de formato CSS para los dos contendores <p> y <blockquote>.

En este primer ejemplo, vamos simplemente a aplicar un fondo gris a un párrafo.

He aquí el código utilizado:

<!DOCTYPE html>  
<html lang="es">  
<head>  
    <title>Párrafo con fondo gris</title>  
    <meta charset="UTF-8" />  
    <link href="#" rel="stylesheet" />  
    <style>  
        .fondo-gris {  
            background-color: #eee;  
        }  
    </style>  
</head>  
<body>  
<p>Aenean lacinia...</p>  
<p class="fondo-gris">Donec ullamcorper...</p>  
<p>Vestibulum id ligula porta...</p>  
</body>  
</html>

El archivo de ejemplo se llama C06-01-p.html.

Utilizaremos la propiedad CSS background-color para aplicar un fondo coloreado. El color es un gris claro: #eee. Aplicaremos a continuación este selector al párrafo deseado: <p class="fondo-gris">Donec...</p>.

He aquí su representación:

images/C06-001.png

Para el segundo ejemplo, ...