Entrar
Cadastre-se
Ajuda
Responder
esse é meu primeiro tutorial postado.
Fujindo um pouco do layout com 2 colunas, conteudo no meio essas coisas e lá lá.
acabei de fazer aqui um layout que contém:
1- um topo com largura de 100%; fora da moldura de 758px de largura
2- uma moldura com 758px de largura(div em vermelho e conteudo)
3- um rodape que tb fica fora da moldura de 758px; com sua propria moldura
obs: sei que existem outras tecnicas no caso do rodape mas acabei fazendo dessa forma.
4- espero que gostem do exemplo, o resto é criatividade. comentem!!!
Vamos ao exemplo:
segue o html
<html> <head> <link href="index.css" rel="stylesheet" type="text/css"/> </head> <body> <div id="topo"> <h1>empresa</h1> </div> <div id="moldura"> <p>Conteudo</p> </div> <div id="moldura_rodape"> <p> rodape, todos os direitos lá, lá,lá,lá,lá,lá,lá,lá,lá,lá,lá,lá,lá,::::::::: </p> </div> </body> </html>
o css
body{
margin:0px;
padding:0px;
text-align:center;
background-color:silver;
font-family:arial, verdana, serif;
font-size:11px;
}
#moldura{
width:758px;
height:500px;
margin:0 auto;
background-color:red;
text-align:left;
}
#topo {
margin-top:-13px;
padding: 0;
width:100%;
height:100px;
background-color:black;
}
h1 {
float:left;
width:150px;
position: static;
color: blue;
line-height: 2em;
}
p {
font-size: 18px;
float:left;
}
#moldura_rodape{
width:758px;
height:45px;
margin:0 auto;
background-color:green;
bottom:0;
}
Quote
