André Buzzo

CRIAÇÃO DE SITES | DESENVOLVIMENTO DE SISTEMAS | CONSULTORIA EM SEO | ORIENTAÇÃO EM TCC

Script – Layout clean com 3 colunas em CSS

Publicado na categoria Banco de Scripts com 9.287 visualizações e 6 comentários

Banco de Scripts - Layout clean com 3 colunas - André Buzzo Webdesign
Fala galera!

Abaixo segue o  script do CSS criado para a vídeo aula!

Abraços!

index.php

<div id="wrapper">
<div id="topo"></div>
<div id="menu"></div>
<div id="conteudo">
<div id="conteudo-canais"></div>
<div id="conteudo-central">
<div class="conteudo-site"></div>
<div class="conteudo-site"></div>
</div>
<div id="conteudo-noticias"></div>
</div>
<div id="rodape"></div>
</div>

estilos.css

/* CSS Document */

* body {
margin:0;
padding:0;
text-align:center;
}

#wrapper {
width:100%;
height:auto;
margin:auto;
display:table;
}

#topo {
height:125px;
background:#36f;
}

#menu {
height:25px;
background:#036;
}

#conteudo {
height:auto;
display:table;
background:#ccc;
margin:auto;
width:100%;
}

#conteudo-canais {
width:15%;
height:350px;
background:#060;
float:left;
}

#conteudo-central {
width:70%;
height:350px;
background:#090;
float:left;
}

#conteudo-noticias {
width:15%;
height:350px;
background:#060;
float:left;
}

#rodape	{
height:125px;
background:#666;
border-top:1px solid #000;
clear:both;
}
  • leandro

    cade o index.php? so esta o css no site andre.

    • Fala Leandro!

      Vou providenciar o script da index meu velho!

      Obrigado pelo aviso!

  • Hewerton

    Boa noite meu caro: seguinte sobre layout clen voce postou so a parte de css mas o index nao esta junto sera que poderia postar serei grato.

    • Fala Hewerton!

      Coloquei o script do index no Banco de Scripts.

      Abraços meu velho!

  • Luciano

    blz andre,
    muito boa sua video aula,
    queria saber onde baixar aquele teu toolbox de redimensionar a pagina e testar em varias resoluções

    abraços aguardo retorno

    • Fala Luciano!!

      Aquilo é o Webdeveloper Tool da Mozilla meu velho! Você precisa do Firefox instalado para poder usá-lo ok?

      Para baixar o complemento, clique aqui!

      Abraços e obrigado pelo comentário e pela visita!!

      Até mais!

Saiba mais sobre

André Buzzo

Sou desenvolvedor web especializado na criação de sites gerenciáveis com Wordpress; colunista da Abraweb - Associação Brasileira de Webdesigners - e tutor na instituição MX Cursos.

Template? Eu programo o seu!

Então você comprou um template, e pensou que ia ser fácil colocar seu site no ar né?

Pode ser fácil sim! Deixa comigo que eu faço ele ficar funcional para ti!

pesquise por conteúdos

Meus cursos

eu recomendo!

instagram