Menu horizontale et 2 sous menu verticale seulement avec css

profiter Messages postés 205 Date d'inscription mercredi 15 juin 2011 Statut Membre Dernière intervention 15 mars 2013 - 23 oct. 2011 à 18:27
profiter Messages postés 205 Date d'inscription mercredi 15 juin 2011 Statut Membre Dernière intervention 15 mars 2013 - 24 oct. 2011 à 09:03
bonjour
je veux avoir un menu verticale que lorsque je passe la souris sur un des menus il m'affiche une liste verticle directement sous le menu
et qlq elts de cette liste lorsque je passe la souris sur eux j'aimerai avoir une autre liste verticle a coté de celle ci et commence de l'element ou j'ai passé la souris
comme le word et ....
et aussi cette barre de menu de ce site

je me suis basé sur un code le voila
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
    <head>
        <title>Menu</title>
        <link type="text/css" rel="stylesheet" href="essaimenu2.css" />
    </head>
    
        
            <li>[# I.Menu]
                
                    <li>[# I.1.Sous menu]</li>
                    <li>[# I.2.Sous menu]
                        
                            <li>[# I.2.a.Sous sous menu]
                                
                                    <li>[# I.2.a.i.Sous sous sous menu]</li>
                                    <li>[# I.2.a.ii.Sous sous sous menu]</li>
                                    <li>[# I.2.a.iii.Sous sous sous menu]</li>
                                
                            </li>
                            <li>[# I.2.b.Sous sous menu]
                                
                                    <li>[# I.2.b.i.Sous sous sous menu]</li>
                                    <li>[# I.2.b.ii.Sous sous sous menu]</li>
                                    <li>[# I.2.b.iii.Sous sous sous menu]</li>
                                
                            </li>
                            <li>[# 1.2.c.Sous sous menu]</li>
                        
                    </li>
                    <li>[# I.3.Sous menu]</li>
                
            </li>
            <li>[# II.Menu]
                
                    <li>[# II.1.Sous menu]</li>
                    <li>[# II.2.Sous menu]</li>
                    <li>[# II.3.Sous menu]</li>
                
            </li>
            <li>[# III.Menu]</li>
        
        <script type="text/javascript">
            <!--
                setHover();
            -->    
</html>

et le css :
ul#menu li ul {display: none;}          /* On cache les sous éléments */

#menu
{
 width: 760px;  /* largeur de toute la liste*/
 list-style-type: none;   /* pour empecher les puces */
 margin-left: 131px; 
 position: absolute; 		/*Pour éviter un décalage du contenu lorsque le menu est déroulé*/
 padding: 0;
 border: 0;
}
#menu li
{
 float: left;		/* pour rendre liste verticale ou bien display: inline*/
 width: 96px;	/* largeur de chauque elt de la liste */
 margin:0;
 padding: 0;
 border: 0;
}

#menu lu, #menu lu lu
{
display: none;		/* pour ne pas s'afficher */
 list-style-type: none;
 margin: 0;
 padding: 0;
 border: 0;
}

ul#menu li:hover > ul {display: block;} /* On affiche les éléments survolés par la souris */


2 réponses

HACKANDROID Messages postés 103 Date d'inscription mardi 12 juillet 2011 Statut Membre Dernière intervention 3 janvier 2013
23 oct. 2011 à 21:52
Bonjour,


Si tu veut il y a un site qui te le permet : LINK

Vla
0
profiter Messages postés 205 Date d'inscription mercredi 15 juin 2011 Statut Membre Dernière intervention 15 mars 2013 8
24 oct. 2011 à 09:03
merci
c'est bon
mais il ne donne pas un menu comme celui de word exel avec une liste deroulante et les sous menus aussi mene parfois a des listes deroulantes
0
Rejoignez-nous