Menu Css Verticale
Résolu/Fermé
lykmozee
Messages postés
71
Date d'inscription
mardi 10 avril 2007
Statut
Membre
Dernière intervention
27 février 2009
-
1 janv. 2009 à 12:26
web-actu Messages postés 99 Date d'inscription dimanche 16 novembre 2008 Statut Membre Dernière intervention 21 août 2009 - 2 janv. 2009 à 12:57
web-actu Messages postés 99 Date d'inscription dimanche 16 novembre 2008 Statut Membre Dernière intervention 21 août 2009 - 2 janv. 2009 à 12:57
Bonjour Tout le monde,
Je suis entrain de réaliser un site web personnel donc j ai effectuer toute les étapes disant que le site est operationelle mais j aimerai en ajouté un menu qui contient des sous menu qui se dévoile en passant la sourie sur le menu parant et comme je suis encore debutant en css j ai du mal a pouvoir le fair seul donc si quelqu un a possede un menu du genre j espere qu il puisse m envoier le code source
J espere que j étais assez clair
Merci;
Je suis entrain de réaliser un site web personnel donc j ai effectuer toute les étapes disant que le site est operationelle mais j aimerai en ajouté un menu qui contient des sous menu qui se dévoile en passant la sourie sur le menu parant et comme je suis encore debutant en css j ai du mal a pouvoir le fair seul donc si quelqu un a possede un menu du genre j espere qu il puisse m envoier le code source
J espere que j étais assez clair
Merci;
A voir également:
- Menu Css Verticale
- Menu déroulant excel - Guide
- Menu caché tv continental edison ✓ - Forum Téléviseurs
- Barre verticale mac ✓ - Forum MacOS
- Windows 11 menu démarrer classique - Guide
- Barre verticale clavier - Forum Clavier
5 réponses
web-actu
Messages postés
99
Date d'inscription
dimanche 16 novembre 2008
Statut
Membre
Dernière intervention
21 août 2009
6
1 janv. 2009 à 12:35
1 janv. 2009 à 12:35
CSS :
#menu ul {
margin:0;
padding:0;
list-style-type:none;
text-align:center;
}
#menu li {
float:left;
margin:auto;
padding:0;
background-color:#00008b;
}
#menu li a {
display:block;
width:100px;
color:white;
text-decoration:none;
padding:5px;
}
#menu li a:hover {
color:#FFD700;
}
#menu ul li ul {
display:none;
}
#menu ul li:hover ul {
display:block;
}
#menu li:hover ul li {
float:none;
}
#menu li ul {
position:absolute;
}
#menu {
height:50px;
}
xHTML:
<div id="menu">
<ul>
<li><a href="index.html">Accueil</a></li>
<li><a href="#">Contacte</a>
<li><a href="#">Membre</a>
<ul>
<li><a href="#">Connexion</a></li>
<li><a href="#">Inscription</a></li>
</ul>
<li><a href="#">Astuces</a>
<ul>
<li><a href="#">Windows XP</a>
<li><a href="#">Windows Vista</a>
<li><a href="#">Internet Explorer</a>
</ul>
</ul>
</div>
Voila j'espere que sa t'aurés été d'utilité
#menu ul {
margin:0;
padding:0;
list-style-type:none;
text-align:center;
}
#menu li {
float:left;
margin:auto;
padding:0;
background-color:#00008b;
}
#menu li a {
display:block;
width:100px;
color:white;
text-decoration:none;
padding:5px;
}
#menu li a:hover {
color:#FFD700;
}
#menu ul li ul {
display:none;
}
#menu ul li:hover ul {
display:block;
}
#menu li:hover ul li {
float:none;
}
#menu li ul {
position:absolute;
}
#menu {
height:50px;
}
xHTML:
<div id="menu">
<ul>
<li><a href="index.html">Accueil</a></li>
<li><a href="#">Contacte</a>
<li><a href="#">Membre</a>
<ul>
<li><a href="#">Connexion</a></li>
<li><a href="#">Inscription</a></li>
</ul>
<li><a href="#">Astuces</a>
<ul>
<li><a href="#">Windows XP</a>
<li><a href="#">Windows Vista</a>
<li><a href="#">Internet Explorer</a>
</ul>
</ul>
</div>
Voila j'espere que sa t'aurés été d'utilité
lykmozee
Messages postés
71
Date d'inscription
mardi 10 avril 2007
Statut
Membre
Dernière intervention
27 février 2009
9
1 janv. 2009 à 17:55
1 janv. 2009 à 17:55
Merci POur ton aide
mais j arrive toujour pas acceder au sous menu je vois que le menu principale qui est acceuil membre....
Par exemple membre ca contient 2 sous menu en clickant ou mm en deplacant la souri sur membre rien ne se passe !!!
donc j espere s il y aune possibilité que lors du click ou bien du deplacement de la souris sur le menu membre les sous menu connexion et inscription s affiche
Merci
PS: j ai tester sur IE6
mais j arrive toujour pas acceder au sous menu je vois que le menu principale qui est acceuil membre....
Par exemple membre ca contient 2 sous menu en clickant ou mm en deplacant la souri sur membre rien ne se passe !!!
donc j espere s il y aune possibilité que lors du click ou bien du deplacement de la souris sur le menu membre les sous menu connexion et inscription s affiche
Merci
PS: j ai tester sur IE6
web-actu
Messages postés
99
Date d'inscription
dimanche 16 novembre 2008
Statut
Membre
Dernière intervention
21 août 2009
6
1 janv. 2009 à 19:41
1 janv. 2009 à 19:41
passe ta souris sur contacte et astuce
sinon moi pour que sa marche je te marque ce que j'ai fais :
xHTML
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
<head>
<title>Yukama ~ Accueil</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" media="screen" type="text/css" title="Design" href="design.css" />
</head>
<body>
<div id="menu">
<ul>
<li><a href="index.html">Accueil</a></li>
<li><a href="#">Contacte</a>
<li><a href="#">Membre</a>
<ul>
<li><a href="#">Connexion</a></li>
<li><a href="#">Inscription</a></li>
</ul>
<li><a href="#">Astuces</a>
<ul>
<li><a href="#">Windows XP</a>
<li><a href="#">Windows Vista</a>
<li><a href="#">Internet Explorer</a>
</ul>
</ul>
</div>
</body>
</html>
Et le CSS
#menu ul {
margin:0;
padding:0;
list-style-type:none;
text-align:center;
}
#menu li {
float:left;
margin:auto;
padding:0;
background-color:#00008b;
}
#menu li a {
display:block;
width:100px;
color:white;
text-decoration:none;
padding:5px;
}
#menu li a:hover {
color:#FFD700;
}
#menu ul li ul {
display:none;
}
#menu ul li:hover ul {
display:block;
}
#menu li:hover ul li {
float:none;
}
#menu li ul {
position:absolute;
}
#menu {
height:50px;
}
Haa oui le fichier .css doit s'appelé design
sinon moi pour que sa marche je te marque ce que j'ai fais :
xHTML
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
<head>
<title>Yukama ~ Accueil</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" media="screen" type="text/css" title="Design" href="design.css" />
</head>
<body>
<div id="menu">
<ul>
<li><a href="index.html">Accueil</a></li>
<li><a href="#">Contacte</a>
<li><a href="#">Membre</a>
<ul>
<li><a href="#">Connexion</a></li>
<li><a href="#">Inscription</a></li>
</ul>
<li><a href="#">Astuces</a>
<ul>
<li><a href="#">Windows XP</a>
<li><a href="#">Windows Vista</a>
<li><a href="#">Internet Explorer</a>
</ul>
</ul>
</div>
</body>
</html>
Et le CSS
#menu ul {
margin:0;
padding:0;
list-style-type:none;
text-align:center;
}
#menu li {
float:left;
margin:auto;
padding:0;
background-color:#00008b;
}
#menu li a {
display:block;
width:100px;
color:white;
text-decoration:none;
padding:5px;
}
#menu li a:hover {
color:#FFD700;
}
#menu ul li ul {
display:none;
}
#menu ul li:hover ul {
display:block;
}
#menu li:hover ul li {
float:none;
}
#menu li ul {
position:absolute;
}
#menu {
height:50px;
}
Haa oui le fichier .css doit s'appelé design
lykmozee
Messages postés
71
Date d'inscription
mardi 10 avril 2007
Statut
Membre
Dernière intervention
27 février 2009
9
1 janv. 2009 à 21:18
1 janv. 2009 à 21:18
Merci l'Ami;
Effectivement comme je t ai dis toute a l heure ca marche pas comme je souhaité sur IE mais par contre ca marche nickel sur firefox
Encore merci pour ton code.
Effectivement comme je t ai dis toute a l heure ca marche pas comme je souhaité sur IE mais par contre ca marche nickel sur firefox
Encore merci pour ton code.
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
web-actu
Messages postés
99
Date d'inscription
dimanche 16 novembre 2008
Statut
Membre
Dernière intervention
21 août 2009
6
2 janv. 2009 à 12:57
2 janv. 2009 à 12:57
Derien sa ma fais plaisire de t'aider.
