Markup HTML: SideBar e Footer Layout CSS com 3 colunas

Você precisa estar logado para dar um feedback. Clique aqui para efetuar o login
Para efetuar o download você precisa estar logado. Clique aqui para efetuar o login
Confirmar voto
0
 (0)  (1)

Veja a última parte da criação do layout com css

Content

O Content é a coluna central e que ocupa mais espaço, pois é onde entra o conteúdo do site, normalmente dinâmico, por exemplo, textos, fotos e vídeos.

#content
{
float: left;
width: 500px;
padding: 20px 0;
margin: 0 0 0 30px;

}

#content h2 {
margin: 0;
}

SideBar

O sidebar é a coluna lateral, onde podemos inserir conteúdo. Para o código a seguir colocaremos um texto simples:

#sidebar
{
float: right;
width: 200px;
padding: 20px 0;
margin: 0 20px 0 0;
display: inline;
}

#sidebar h3 { margin: 0; }

Footer

Footer é o rodapé do site, onde podemos colocar informações complementares, como alguns links menos importantes, por se tratar de uma área de pouca visão de leitura.

#footer
{

clear: left;
background: #ccc;
text-align: right;
padding: 20px;
height: 1%;

}

Markup HTML

A marcação HTML é a estrutura do nosso site de exemplo, onde estão as Tags HTMLs, necessárias pra obtermos o resultado esperado. Cada ID em nosso HTML tem um ID no CSS que mencionamos anteriormente.










Page heading

Lorem ipsum dolor sit amet consect etuer adipi scing elit sed diam nonummy nibh euismod tinunt ut laoreet

Ut amet, diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.

Duis exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.

Neste artigo obtemos uma pequena introdução sobre a estrutura HTML para fazer um hot site, que pode ser usada para criar seu primeiro site.

 
Você precisa estar logado para dar um feedback. Clique aqui para efetuar o login
Receba nossas novidades
Ficou com alguma dúvida?