Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Pessoal, gostaria de uma ajuda de vocês...
Preciso montar um layout com três LINHAS sendo:
- Na primeira linha uma logo à esquerda, um flash no meio e outra imagem à direita;
- Na segunda linha um menu de acesso rápido como o dia por extenso, alguns ícones (6) e campos de usuário e senha para logar no site;
- Na teceira linha uma área de conteúdo que será composta por várias abas
O problema:
- Não consigo colocar na primeira linha uma imagem à esquerda, o flash no meio e outra a direita. Só ficam o flash e a imagem da direita;
- Na segunda linha, não consigo colocar "inline" o dia, os ícones e o login e senha;
- Na terceira linha, estou estudando formas para criar as abas, Dicas?
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<title>Emaús Nacional</title>
<style type="text/css" media="screen, projection">
* {
padding:0;
margin:0;
border:0;
}
body {
font-size:67.5%;
text-align:center;
min-width:760px;
font-family:Verdana, Tahoma, Arial;
}
p {
margin: 0 0 15px 0;
}
#divPrincipal{
background-color:blue;
}
#divCabecalho {
background-color:#286198;
height: 100px;
}
#divConteudo {
background-color: #FFFFFF;
padding: 10px;
}
#divMenu {
background-color: #286198; /* definido cor de background */
height: 40px; /* definindo altura de 40px */
clear: both; /* não permitindo que objetos "flutuantes" obstruam o rodapé. */
}
a:link, a:visited {
text-decoration:none;
border-bottom:1px dotted #000;
}
a:hover, a:active {
border-bottom-style:solid;
}
ul, ol {
list-style:none;
width:100%;
float:left;
}
ul li {
float:left;
}
h1, h2, h3 {
margin: 0.8em 0;
color:#c30;
font-size:1.4em;
}
</style>
</head>
<body id="www.emaus.org.br">
<div id="divPrincipal">
<div id="divCabecalho">
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="[http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0"](http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0) height="140" width="380">
<param name="movie" value="vinheta.swf">
<param name="quality" value="high">
<param name="bgcolor" value="#ffffff">
<embed type="application/x-shockwave-flash" src="img/vinheta.swf" quality="high" bgcolor="#ffffff" pluginspage="[http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash"](http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash) height="140" width="380">
</object>
</div>
<div id="divMenu">
<label>{dia_semana}, {hoje} </label>
<ul id="subMenu">
<li><a href="admin.php?modulo=Alavanca"><img name="img_alavanca" src="img/ic_alavanca_off.gif" height="28" width="27"></a></li>
<li><a href="admin.php?modulo=Fale_conosco"><img name="img_fale_conosco" src="img/ic_fale_off.gif" height="28" width="27"></a></li>
<li><a href="admin.php?modulo=Alavanca"><img name="img_alavanca" src="img/ic_galeria_off.gif" height="28" width="27"></a></li>
<li><a href="admin.php?modulo=Documento"><img name="img_documentos" src="img/ic_jornal_off.gif" height="28" width="27"></a></li>
<li><a href="admin.php?modulo=Link"><img name="img_link" src="img/ic_link_off.gif" height="28" width="27"></a></li>
</ul>
<form method="post" id="frmAcesso" name="frmAcesso">
<label>Usuário:
<input id="usuario_login" type="text" name="usuario_login" value="{usuario_login}" autocomplete="off"><br>
</label>
<label>Senha:
<input id="senha_login" type="password" name="senha_login" value="{senha_login}" autocomplete="off"><br>
</label>
<input id="login" type="submit" name="acao" value="Ok">
</form>
</div>
<div id="divConteudo">
<ul>
<li><a href="#tab1"><span>Tab 1</span></a></li>
<li><a href="#tab2"><span>Tab 2</span></a></li>
<li><a href="#tab3"><span>Tab 3</span></a></li>
</ul>
<div id="tab1">
<p>First tab is active by default:</p>
<pre><code>$('#container').tabs();</code></pre>
</div>
<div id="tab2">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
</div>
<div id="tab3">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
</div>
</div>
</div>
</body>
</html>Carregando comentários...