Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
galera, esse é meu primeiro código em tableless, nao sei se eestá certo, e estou postando o código aqui, para que me aconselhem, me diga oque melhorar etc.
como dizem, é errando que se aprende, e estou postando para que vocês possam me dizer aonde estou errando! :D
obrigado.
<!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">](http://www.w3.org/1999/xhtml)
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css"> margin:0;
padding:0;
}
form {
margin:0;
padding:0;
} border:0;
}
body {
background-color: #07455e;
background-image: url(imagens/bg.gif);
background-repeat: repeat-x;
}
#principal {
width: 300px;
position: absolute;
top: 30%;
left: 50%;
margin-top:100px;
margin-left:-150px;
}
#faixa_azul {
position: absolute;
background:#054159;
top:30%;
width:100%;
height:55px;
}
#titulo {
width:100%;
position:absolute;
top:-16px;
text-align:center;
}
#campo_login {
height:36px;
padding-bottom:5px;
}
#login-left{
background:url(imagens/login_bg1.gif) no-repeat;
float: left;
height:100%;
width: 7px;
}
#login-center {
background:url(imagens/login_bg2.gif) repeat-x;
float: left;
height:100%;
}
#login-right{
background:url(imagens/login_bg3.gif) no-repeat;
float: left;
height:100%;
width: 7px;
}
input#login {
margin-top:6px;
background:transparent;
border:0px solid;
width:286px;
}
input#senha {
margin-top:6px;
background:transparent;
border:0px solid;
width:205px;
}
.texto_branco {
font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
color:#FFFFFF;
font-size:14px;
font-weight:bold;
}
.botao_logar {
margin-top:-41px;
margin-left:224px;
}
#botao_logar {
position:absolute;
width:76px;
height:36px;
background-image:url(imagens/bt_logar.gif);
}
#botao_logar a:hover div {
background:url(imagens/bt_logar.gif) 0 -36px;
height:36px;
}
#esqueci_senha {
padding-top:10px;
text-align:right;
font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
font-size:12px;
}
a.link_azul:link,visited,active {
color:#6fa4b9;
text-decoration:underline;
}
a.link_azul:hover {
color:#9ac9dc;
text-decoration:underline;
}
</style>
</head>
<body>
<div id="faixa_azul"><div id="titulo"><img src="bg_logijn.png" width="326" height="91" /></div></div>
<div id="principal">
<div id="campo_login">
<div id="login-left"></div>
<div id="login-center">
<input class="texto_branco" name="login" id="login" type="text" />
</div>
<div id="login-right"></div>
</div>
<div id="campo_login">
<div id="login-left"></div>
<div id="login-center">
<input class="texto_branco" name="senha" id="senha" type="password" />
</div>
<div id="login-right"></div>
</div>
<div id="botao_logar" class="botao_logar">
<a href="#">
<div id="botao_logar"></div>
</a>
</div>
<div id="esqueci_senha"><a href="#" class="link_azul">esqueci minha senha</a></div>
</div>
</body>
</html>Carregando comentários...