Inicio > Crear web desde cero > Maquetar cabecera con CSS

Maquetar cabecera con CSS

Recomendar lección:

Seguimos con las lecciones para maquetar nuestra primer pagina web, en esta ocación veremos como maquetar la cabecera

Cabecera

Teniendo el contenedor general y siguiendo el diagrama de maquetación que vimos antes, es hora de crear la cabecera de nuestro sitio, a esta le asignaremos el alto que queremos que tenga, siempre dentro de los limites que definimos en el contenedor general, obviamente usaremos mucho menos, solo 50 pixeles, y también un color de fondo (verde) para ir notando cada capa, quedando así:

#cabecera {
       background-color: green;
       height:50px;
       padding:5px;
}


y llamamos a esta capa desde el código HTML, pero ojo, tiene que ir dentro de la capa contenedora, así:

<html>
<head>
<title>Maquetando con estilos CSS</title>
<link href="estilos.css" rel="stylesheet" type="text/css">
</head>
<body>
        <div id="contenedor">
                <div id="cabecera">Esta es la cabecera</div>
       </div>

</body>
</html>

 


Perfecto, ya hemos maquetado el contenedor general y la cabecera, sigamos con la barra lateral.