Vous êtes sur la page 1sur 2

<html>

<head>
<title> MENU DESPLEGABLE </title>
<style type="text/css">
*{
padding:0x;
margin:0px;
}
#header{
margin:auto;
width: 800px;
font-family:Arial,Helvetica, sans-serif;
}
ul,ol{
list-style:none;
}
.nav li a{
background-color:#000;
color:#fff;
text-decoration:none;
padding:10px 15px;
display:block;
}
.nav li a:hover{
background-color:#434343;
}
.nav >li {
float:left;
}
.nav li ul{
display:none;
position:absolute;
min-width:140px;
}
.nav li:hover > ul{
display:block;
}
.nav li ul li{
position:relative;
}
.nav li ul li ul{
right:-140px;
top:0px;
}

</style>
</head>
<body>
<div id="header">
<ul class="nav">
<li><a href="">INICIO</a></li>
<li><a href="">SERVICIOS</a>
<ul>
<li><a href="">submenu1</a></li>
<li><a href="">submenu2</a></li>

<li><a href="">submenu3</a></li>
<li><a href="">submenu4</a>
<ul>
<li><a href="">submenu1</a></li>
<li><a href="">submenu2</a></li>
<li><a href="">submenu3</a></li>
</ul>
</li>
</ul>
</li>
<li><a href="">A CERCA DE </a></li>
<li><a href="">CONTACTO </a></li>
</ul>
</div>
</body>
</html>