<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel="stylesheet" href="estilo-general.css" type="text/css" media="all">
<title>Page title</title>
</head>
<body>
<div id="global">
<div id="curva-superior"></div>
<div id="cabecera">
<div id="logotipo"><a href="index.html"><img src="objetos/logotipo.gif" width="270" height="80" alt="Haz click aquí para volver a la página de inicio"></a></div>
<div id="publicidad" width="518" height="80">Bienvenidos a mi Web</div>
</div>
<div id="navegacion">
<ul><li><a href="#">Sección 1</a></li><li><a href="#">Sección 2</a></li><li><a href="#">Sección 3</a></li><li><a href="#">Sección 4</a></li></ul>
</div>
<div id="contenido">
<div id="menu">
<ul><h1>Título de Sección 1</h1><li><a href="#">Primer elemento</a></li><li><a href="#">Segundo elemento</a></li><li><a href="#">Tercer elemento</a></li><li><a href="#">Cuarto elemento</a></li></ul>
</div> <h1>Esta será la zona princpal de la Web</h1>
<p>La cosa va mejorando pero ahora vemos como los textos se pegan demasiado tanto al menú lateral como a los extremos de la página. Eso no queda muy bien, así que vamos a arreglarlo.
Tienes dos opciones, una es definirle el margen concreto a cada uno de los párrafos de todas tus páginas web, o algo un poco más sencillo, poner un par de palabras en la Hoja de Estilo y listo. Qué prefieres? je je je.</p></br>
<h2>Este es el segundo parrafo</h2>
<p>Abre la Hoja de Estilos de la plantilla.html (estilo-general.css) y vamos a reparar esos márgenes. Como los textos que vemos sin margen pertenecen a la capa de fondo naranja (orange) y en la Hoja de Estilos solo pone "orange" en la capa "#contenido", ya sabemos a qué capa incluirle la propiedad padding (el padding es parecido al margin, ya veremos la diferencia), verdad? Por eso le pusimos esos colores tan feos, para encontrar cada capa rápidamente, je je je. Pero solo queremos por ahora poner margen a sus párrafos, es decir, queremos márgenes para los párrafos de dentro de la capa #contenido, así que, si recuerdas bien lo que hicimos la otra vez, esto se pone así:</p>
</div>
<div id="pie">Este es el pié de página</div>
<div id="curva-inferior"></div>
</div>
</body>
</html>
