Fóruns sobre PHP, JavaScript, HTML, MySQLi, jQuery, Banco de Dados, CSS


Moderador: web

 
Avatar do usuário
ADMIN
ADMIN
Tópico Autor
Mensagens: 17416
Nome: Kleber
Descrição do site: Onde você encontra scripts grátis para o seu site
Sexo: Masculino
Localização: RJ / RJ / Brasil
Contato:

Layout em tableless

15-02-2009 19:42

Segue abaixo um exemplo de um layout todo em tableless

Fonte: http://articles.techrepublic.com.com/51 ... 14471.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>Untitled Document</title> <style type="text/css"> <!-- body {         font-family: Verdana, Arial, Helvetica, sans-serif;         font-size: 12px;         padding: 0px;         margin: 0px; } h2,h3 {         margin-top: 0px;         padding-top: 0px; } div#head {         left:0px;         width:750px;         height:100px;         background-color: #FFFF66;         top: 0px;         position: absolute; } div#wrapper {         position:relative;         margin-left:auto;         margin-right:auto;         top: 20px;         width:750px;           background-color: #CCCCCC; } div#columns {         width: 750px;         position: relative;         top: 100px;         background-color: #CCCCCC; } div#side1 {         position:absolute;         left:0px;         width:150px;         background-color: #FF6666;         top: 0px; } div#content {         background-color: #999999;         width: 450px;         position: static;         margin-top: 1px;         margin-left: 150px; } div#side2 {         position:absolute;         width:150px;         background-color: #00FF66;         left: 600px;         top: 0px; } div#foot {         background-color: #99FFFF;         width: 750px;         clear: both;         position: relative;         margin-top: 100px; } .clear {         clear:both; } --> </style> </head> <body> <div id="wrapper"> <div id="head">         <h1>header</h1> </div> <div id="columns">         <div id="side1">                 <h3>side1</h3>                 <ul>                         <li>Let me not to the marriage of true minds</li>                         <li>Admit impediments; love is not love</li>                         <li>Which alters when it alteration finds</li>                         <li>Or bends with the remover to remove</li>                         <li>Oh, no, it is an ever fixed mark</li>                 </ul>         </div>         <div id="content">                 <h2>main content</h2>                 <p>That looks on tempests and is never shaken; love's not time's fool, though rosy lips and cheeks love alters not with his brief hours and weeks. Or bends with the remover to remove. Whose worth's unknown, although his height be taken.</p>                 <p>But bears it out even to the edge of doom. Which alters when it alteration finds, if this be error and upon me proved, let me not to the marriage of true minds. I never writ, nor no man ever loved. Admit impediments; love is not love that looks on tempests and is never shaken; love's not time's fool, though rosy lips and cheeks. Which alters when it alteration finds.</p>                 <p>Whose worth's unknown, although his height be taken. Let me not to the marriage of true minds admit impediments; love is not love it is the star to every wand'ring bark. Which alters when it alteration finds, but bears it out even to the edge of doom. Within his bending sickle's compass come; I never writ, nor no man ever loved. If this be error and upon me proved, that looks on tempests and is never shaken; or bends with the remover to remove.</p>                         </div>         <div id="side2">                 <h3>side2</h3>                 <ul>                         <li>Let me not to the marriage of true minds</li>                         <li>Admit impediments; love is not love</li>                         <li>Which alters when it alteration finds</li>                 </ul>         </div> </div> <div id="foot">         <h3>footer</h3>         <p>Or bends with the remover to remove. Love's not time's fool, though rosy lips and cheeks which alters when it alteration finds, whose worth's unknown, although his height be taken. </p> </div> </div> </body> </html>

0
Tem um script legal em HTML, CSS, PHP, HTML, JavaScript, jQuery? Poste e compartilhe com os usuários do fórum :rock:

Quem está online

Usuários navegando neste fórum: Nenhum usuário registrado