<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link rel="stylesheet" type="text/css" href="layout.css"/>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento sem título</title>
</head>
<body>
<div id="geral">
<div id="topo"> </div>
<div id="menu">
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">Galeria</a></li>
<li><a href="#">Contato</a></li>
</ul>
</div>
<div id="conteudo"> </div>
<div id="galeria">
<div id="box1" class="box"> </div>
<div id="box2" class="box"> </div>
<div id="box3" class="box"> </div>
</div>
<div id="rodape"> </div>
</div>
</body>
</html>
@charset "utf-8";
/* CSS Document */
#geral {width:1024px; height:768px;background:#999;margin:auto;}
#topo {width:1024px; height:208px;background:#000;margin:auto;}
#menu {width:256px;height:281px;background:#09F; float:left;}
#conteudo {width:768px;height:281px;background:#063;margin-left:255px;}
#galeria {width:1024px;height:210px;background:#003;float:left;}
.box {width:256px;height:160px;background:#9C0; float:left;margin-left:50px; margin-top:15px}
#rodape{width:1024px;height:71px;background:#000; clear:both}
/*Menu*/
#menu ul {margin:0;padding:0;}
#menu li{list-style:none;margin-top:10px}
#menu a:link,a:visited {color:#FFF;font:"Courier New", Courier, monospace;font-size:22px;background:#00F;padding:20px;display:block;}
#menu a:hover{background:#999;}
MEU HORIZONTAL
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link rel="stylesheet" type="text/css" href="layout-2.css"/>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento sem título</title>
</head>
<body>
<div id="geral">
<div id="menu">
<ul>
<li><a href="#" id="home">Home</a></li>
<li><a href="#" id="quemsomos">Quem Somos</a></li>
<li><a href="#" id="galeria">Galeria</a></li>
<li><a href="#" id="portfolio">Portfolio</a></li>
<li><a href="#" id="servicos">Serviços</a></li>
<li><a href="#" id="contatos">Contatos</a></li>
</ul></div>
</div>
</body>
</html>
@charset "utf-8";
/* CSS Document */
#geral {width:800px; height:768px;background:#FFF;margin:auto;}
#menu {width:800px;height:70x;background:#000;float:left}
/*Menu*/
#menu ul {padding:0;margin:0}
#menu li {list-style:none;margin-top:10px;float:left;}
#menu a:link,a:visited {color:#FFF;font:"Lucida Sans Unicode", "Lucida Grande", sans-serif;font-size:20px;background:#666;padding:20px;display:block;margin:11px}
#menu a:visited#home, a:link#home{background:#C93;}
#menu a:visited#quemsomos, a:link#quemsomos{background:#CC3;}
#menu a:visited#galeria, a:link#galeria{background:#30F;}
#menu a:visited#portfolio, a:link#portfolio{background:#F30;}
#menu a:visited#servicos, a:link#servicos{background:#93C;}
#menu a:visited#contatos, a:link#contatos{background:#900;}
#menu a:hover {background:#09F}
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link rel="stylesheet" type="text/css" href="layout.css"/>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento sem título</title>
</head>
<body>
<div id="geral">
<div id="topo"> </div>
<div id="menu">
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">Galeria</a></li>
<li><a href="#">Contato</a></li>
</ul>
</div>
<div id="conteudo"> </div>
<div id="galeria">
<div id="box1" class="box"> </div>
<div id="box2" class="box"> </div>
<div id="box3" class="box"> </div>
</div>
<div id="rodape"> </div>
</div>
</body>
</html>
@charset "utf-8";
/* CSS Document */
#geral {width:1024px; height:768px;background:#999;margin:auto;}
#topo {width:1024px; height:208px;background:#000;margin:auto;}
#menu {width:256px;height:281px;background:#09F; float:left;}
#conteudo {width:768px;height:281px;background:#063;margin-left:255px;}
#galeria {width:1024px;height:210px;background:#003;float:left;}
.box {width:256px;height:160px;background:#9C0; float:left;margin-left:50px; margin-top:15px}
#rodape{width:1024px;height:71px;background:#000; clear:both}
/*Menu*/
#menu ul {margin:0;padding:0;}
#menu li{list-style:none;margin-top:10px}
#menu a:link,a:visited {color:#FFF;font:"Courier New", Courier, monospace;font-size:22px;background:#00F;padding:20px;display:block;}
#menu a:hover{background:#999;}
MEU HORIZONTAL
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link rel="stylesheet" type="text/css" href="layout-2.css"/>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento sem título</title>
</head>
<body>
<div id="geral">
<div id="menu">
<ul>
<li><a href="#" id="home">Home</a></li>
<li><a href="#" id="quemsomos">Quem Somos</a></li>
<li><a href="#" id="galeria">Galeria</a></li>
<li><a href="#" id="portfolio">Portfolio</a></li>
<li><a href="#" id="servicos">Serviços</a></li>
<li><a href="#" id="contatos">Contatos</a></li>
</ul></div>
</div>
</body>
</html>
@charset "utf-8";
/* CSS Document */
#geral {width:800px; height:768px;background:#FFF;margin:auto;}
#menu {width:800px;height:70x;background:#000;float:left}
/*Menu*/
#menu ul {padding:0;margin:0}
#menu li {list-style:none;margin-top:10px;float:left;}
#menu a:link,a:visited {color:#FFF;font:"Lucida Sans Unicode", "Lucida Grande", sans-serif;font-size:20px;background:#666;padding:20px;display:block;margin:11px}
#menu a:visited#home, a:link#home{background:#C93;}
#menu a:visited#quemsomos, a:link#quemsomos{background:#CC3;}
#menu a:visited#galeria, a:link#galeria{background:#30F;}
#menu a:visited#portfolio, a:link#portfolio{background:#F30;}
#menu a:visited#servicos, a:link#servicos{background:#93C;}
#menu a:visited#contatos, a:link#contatos{background:#900;}
#menu a:hover {background:#09F}
Nenhum comentário:
Postar um comentário