Lida 7773 vezes
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN""http://www.w3.org/TR/html4/loose.dtd"><html><head><title>Untitled Document</title><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"><link rel="stylesheet" type="text/css" href="http://meusite.com/estilo.css" /></head><body><div id="geral"> <div id="cabecalho"> <div id="logo"><a href="http://meusite.com/"><img src="imagens/logo.png" alt="meusite" border="0"></a> </div> </div></div></body></html>
/* CSS Document */#geral { width:980px; margin-right: auto; margin-left: auto; text-align: left; } #cabecalho { background-image: url(imagens/f_cabecalho.jpg); background-color:#000033; heigth:100px; } #logo { float: left; display: inline; margin-left: 10px; }
#conteudo { background-image:url(imagens/fundo.jpg); height:440px; } #caixa1 { padding-left:20px; padding-top:20px; width:400px; height:auto; float:left; } #titulo1 { color:#eaeeed; background-image:url(imagens/f_azul.jpg); height:24px; font-size:16px; font-weight:bold; } #subcaixa1 { background-color:#eaeeed;}#texto1 { color:#104770; font-size:12px; width:390px; padding-left:5px; } #caixa2 { padding-left:440px; padding-top:20px; width:200px; height:auto; float:right; } #titulo2 { color:#eaeeed; background-image:url(imagens/f_azul.jpg); height:24px; font-size:16px; font-weight:bold; } #subcaixa2 { background-color:#eaeeed;}#texto2 { color:#104770; font-size:12px; width:190px; padding-left:5px; }
<div id="conteudo"> <div id="caixa1"> <div id="titulo1"><img src="imagens/transp.png" width="15" height="5" border="0">titulo </div> <div id="subcaixa1"> <div id="texto1">texto </div> </div> </div> </br> <div id="caixa2"> <div id="titulo2"><img src="imagens/transp.png" width="15" height="5" border="0">titulo</div> <div id="subcaixa2"> <div id="texto2">texto</div> </div> </div> </div>
#conteudo { background-image:url(imagens/fundo.jpg); height:440px; } #caixa1 { padding-left:20px; padding-top:20px; width:400px; height:auto; float:left; } #titulo1 { color:#eaeeed; background-image:url(imagens/f_azul.jpg); height:24px; font-size:16px; font-weight:bold; } #subcaixa1 { background-color:#eaeeed;}#texto1 { color:#104770; font-size:12px; width:390px; padding-left:5px; } #caixa2 { padding-left:440px; padding-top:20px; width:200px; height:auto; float:left; } #titulo2 { color:#eaeeed; background-image:url(imagens/f_azul.jpg); height:24px; font-size:16px; font-weight:bold; } #subcaixa2 { background-color:#eaeeed;}#texto2 { color:#104770; font-size:12px; width:190px; padding-left:5px; }
#caixa2 { margin-left:20px; padding-top:20px; width:200px; float:left; }
Showcase
UI & UX Design