Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
e ai pessoal, depois de ver varias apostilas de css, fiz meu primeiro menu...
porém tenho algumas duvidas ainda em relação ao posicionamento do submenu...
olhem o código:
<!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>Untitled Document</title>
<style type="text/css">
#menu {
height: 80px;
width: 760px;
list-style-type: none;
}#menu li {
float:left;
}#menu li ul{
float:none;
margin-top:2px;
padding:0px;
position:absolute;
list-style-type:none;
height:auto;
width:auto;
}#menu li ul li{
float:left;
}#menu li ul{
display:none;
}#menu li:hover ul{
display:block;
}#menu li a{
font-family: Geneva, Arial, Helvetica, sans-serif;
font-size: 12px;
color: #FF0000;
border: 1px solid #FF0000;
width: 80px;
display: block;
text-decoration: none;
background-color: #000000;
margin:0px 2px 0px 0px;
padding: 10px;
text-align: center;
}#menu li a:hover{
color:#000000;
border:1px dotted #000000;
background-color: #FF0000;
}
</style>
</head>
<body>
<div id="tudo">
<ul id="menu">
<li><a href="#">Menu 1</a></li>
<li><a href="#">Menu 2</a>
<ul>
<li><a href="#">Submenu 2#1</a></li>
<li><a href="#">Submenu 2#2</a></li>
<li><a href="#">Submenu 2#3</a></li>
</ul>
</li>
<li><a href="#">Menu 3</a></li>
<li><a href="#">Menu 4</a>
<ul>
<li><a href="#">Submenu 4#1</a></li>
<li><a href="#">Submenu 4#2</a></li>
</ul>
</li>
<li><a href="#">Menu 5</a></li>
</ul>
</div>
</body>
</html>bem simples, sem imagens...
porém, ele exibe o submenu assim:
http://img11.imageshack.us/i/19629421.png/
e queria que exibisse assim:
http://img210.imageshack.us/i/55341311.png/
sem o espaço...se não intendeu salve o código que você intende ^^
também se quiserem citar algumas melhorias que posso fazer no código...
Carregando comentários...