Probléme de menu deroulant avec div
Résolu/Fermé
mimou2601
Messages postés
82
Date d'inscription
dimanche 12 avril 2009
Statut
Membre
Dernière intervention
16 mai 2017
-
3 juil. 2013 à 00:03
mimou2601 Messages postés 82 Date d'inscription dimanche 12 avril 2009 Statut Membre Dernière intervention 16 mai 2017 - 6 juil. 2013 à 05:00
mimou2601 Messages postés 82 Date d'inscription dimanche 12 avril 2009 Statut Membre Dernière intervention 16 mai 2017 - 6 juil. 2013 à 05:00
A voir également:
- Probléme de menu deroulant avec div
- Menu déroulant excel - Guide
- Excel menu déroulant en cascade - Guide
- Menu déroulant google sheet - Accueil - Guide bureautique
- Windows 11 menu démarrer classique - Guide
- Canon quick menu - Télécharger - Utilitaires
2 réponses
Nacim59
Messages postés
22
Date d'inscription
mercredi 26 juin 2013
Statut
Membre
Dernière intervention
13 août 2013
5 juil. 2013 à 11:18
5 juil. 2013 à 11:18
Salut,
Voici un code qui pourra t'aider ,tu dois l'adapter à ton besoin
#########################################
HTML
#########################################
<div id="menu">
<ul>
<li>
<a href="accueil.html" class="bordureG">Accueil</a></li>
</ul>
<ul>
<li>
<a href="#">Recettes</a>
<ul>
<li><a href="boeuf.html">Boeuf</a></li>
<li><a href="agneau.html">Agneau</a></li>
<li><a href="fruits de mer.html">Fruits de mer</a></li>
<li><a href="volaille.html">Volaille</a></li>
<li><a href="Sucree.html">Sucrée</a></li>
</ul>
</li>
</ul>
<ul>
<li>
<a href="#">Recettes video</a>
<ul>
<li><a href="fried rice.html">Fried Rice</a></li>
<li><a href="poulet tandoori.html">Poulet Tandoori</a></li>
</ul>
</ul>
<ul>
<li>
<a href="index.html">Déconnexion</a>
<ul>
</ul>
</li>
</ul>
</div>
##########################################
CSS
##########################################
/*menu*/
#menu
{
margin-top:-4%;
width:100%;
height:60px;
background:#d17a82;
COLOR:#ffffff;
}
#menu ul
{
margin-left:175px;
padding:0;
line-height:60px;
}
#menu li
{
list-style:none;
float:left;
position:relative;
background-color:#3f0508;
}
#menu ul li a
{
color:#000;
text-decoration:none;
width:150px;
height:60px;
display:block;
text-align:center;
border-right:1px solid #ffffff;
COLOR:#ffffff;
}
.bordureG{
border-left:1px solid #ffffff;
}
#menu ul ul
{
position:absolute;
top:60px;
left:-175PX;
visibility:hidden;
}
#menu ul li{
border-bottom:1px solid #ffffff;
border-top:1px solid #ffffff;
}
#menu ul li:hover ul
{
visibility:visible;
}
#menu li:hover
{
background-color:#8f4349;
}
#menu ul li ul a:hover
{
color:#fff;
background-color:#8f4349;
}
Bon courage
Voici un code qui pourra t'aider ,tu dois l'adapter à ton besoin
#########################################
HTML
#########################################
<div id="menu">
<ul>
<li>
<a href="accueil.html" class="bordureG">Accueil</a></li>
</ul>
<ul>
<li>
<a href="#">Recettes</a>
<ul>
<li><a href="boeuf.html">Boeuf</a></li>
<li><a href="agneau.html">Agneau</a></li>
<li><a href="fruits de mer.html">Fruits de mer</a></li>
<li><a href="volaille.html">Volaille</a></li>
<li><a href="Sucree.html">Sucrée</a></li>
</ul>
</li>
</ul>
<ul>
<li>
<a href="#">Recettes video</a>
<ul>
<li><a href="fried rice.html">Fried Rice</a></li>
<li><a href="poulet tandoori.html">Poulet Tandoori</a></li>
</ul>
</ul>
<ul>
<li>
<a href="index.html">Déconnexion</a>
<ul>
</ul>
</li>
</ul>
</div>
##########################################
CSS
##########################################
/*menu*/
#menu
{
margin-top:-4%;
width:100%;
height:60px;
background:#d17a82;
COLOR:#ffffff;
}
#menu ul
{
margin-left:175px;
padding:0;
line-height:60px;
}
#menu li
{
list-style:none;
float:left;
position:relative;
background-color:#3f0508;
}
#menu ul li a
{
color:#000;
text-decoration:none;
width:150px;
height:60px;
display:block;
text-align:center;
border-right:1px solid #ffffff;
COLOR:#ffffff;
}
.bordureG{
border-left:1px solid #ffffff;
}
#menu ul ul
{
position:absolute;
top:60px;
left:-175PX;
visibility:hidden;
}
#menu ul li{
border-bottom:1px solid #ffffff;
border-top:1px solid #ffffff;
}
#menu ul li:hover ul
{
visibility:visible;
}
#menu li:hover
{
background-color:#8f4349;
}
#menu ul li ul a:hover
{
color:#fff;
background-color:#8f4349;
}
Bon courage
mimou2601
Messages postés
82
Date d'inscription
dimanche 12 avril 2009
Statut
Membre
Dernière intervention
16 mai 2017
7
6 juil. 2013 à 05:00
6 juil. 2013 à 05:00
merci beaucoup :)