Menu déroulant
Fermé
Cainzer
Messages postés
250
Date d'inscription
mardi 18 août 2009
Statut
Membre
Dernière intervention
19 octobre 2023
-
18 août 2009 à 12:19
Cainzer Messages postés 250 Date d'inscription mardi 18 août 2009 Statut Membre Dernière intervention 19 octobre 2023 - 18 août 2009 à 14:23
Cainzer Messages postés 250 Date d'inscription mardi 18 août 2009 Statut Membre Dernière intervention 19 octobre 2023 - 18 août 2009 à 14:23
A voir également:
- Menu déroulant
- Menu déroulant excel - Guide
- Excel menu déroulant en cascade - Guide
- Windows 11 menu démarrer classique - Guide
- Menu déroulant google sheet - Guide
- Canon quick menu - Télécharger - Utilitaires
2 réponses
manelsousse
Messages postés
59
Date d'inscription
lundi 10 mars 2008
Statut
Membre
Dernière intervention
18 août 2009
18 août 2009 à 12:26
18 août 2009 à 12:26
Essayez ca:
voici le code:<div class="MenuTop">
<ul>
<li><a href="index.php" style="background-image:url(images/bg_menuprcpl_current.png)" >Accueil</a></li><ul><li>sous_menu1<li><ul>
<ul></div>
et voici la feuille de style:
.MenuTop {
font-family: Tahoma;
font-size: 10px;
font-weight: normal;
color: #999999;
height:30px;
white-space:nowrap; /*IE hack*/
border:none;
width:1000px;
}
.MenuTop ul {
list-style-type:none;
padding:0;
margin:0;
}
.MenuTop ul li {
list-style:none;
display:block;
float:left;
height:30px;
line-height:38px;
font-family:Tahoma;
letter-spacing:1px;
font-weight: lighter;
z-index:auto !important;
z-index:1000;
font-size:10px;
}
.MenuTop ul li.last {
float:left;
z-index:auto !important;
z-index:1000;
font-size:10px;
background:url(../images/bg_menuprcpl_current.png) repeat-x left;
}
.MenuTop ul li a {
float:none !important;
float:left;
display:block;
height:30px;
line-height:30px;
padding:0 17px 0 18px;
text-decoration:none;
font-weight:bold;
color:#fff;
}
.MenuTop ul li ul {
display:none;
border:none;
}
.MenuTop ul li:hover {
position:relative;
background:url(../images/bg_menuprcpl_current.png) repeat-x left;
}
.MenuTop ul li.last:hover {
position:relative;
background:url(../images/bg_menuprcpl_current.png) repeat-x left;
}
.MenuTop ul li:hover a {
color:#FFF;
}
.MenuTop ul li:hover ul {
display:block;
width:10.0em;
position:absolute;
z-index:999;
top:30px;
/*margin-top:1px;*/
left:0;
}
.MenuTop ul li:hover ul li a {
white-space:normal;
display:block;
width:160px;
height:auto;
line-height:18px;
margin-left:-1px;
border-left:1px solid #CCC;
border-bottom:1px solid #CCC;
border-right:1px solid #CCC;
background-color:#EAEAEA;
font-weight:normal;
font-size:11px;
color:#000;
}
.MenuTop ul li:hover ul li a:hover {
background-color:#FFF;
text-decoration:none;
}
#rubrique_actif {
background:url(../images/bg_menuprcpl_current.png) repeat-x left;
color:#FFF;
margin-left:1px !important;
padding:0 25px;
padding:0 5px 0 5px;
}
.MenuTop table {
position:absolute;
top:0;
left:0;
border-collapse:collapse;
}
.MenuTop ul li ul li a {
text-align:left;
}
.MenuTop ul li a:hover ul li a {
white-space:normal;
display:block;
width:130px;
height:1px;
line-height:18px;
padding:4px 16px 4px 16px;
border-left:solid 1px #CCC;
border-bottom:solid 1px #CCC;
background:none;
background-color:#EAEAEA;
font-weight:normal;
color:#333;
}
.MenuTop ul li a:hover ul li a:hover {
background:#FFF;
background-color:#FFF;
text-decoration:none;
}
.MenuTop ul li ul li a:hover {
background:#FFF;
background-color:#FFF;
text-decoration:none;
}
voici le code:<div class="MenuTop">
<ul>
<li><a href="index.php" style="background-image:url(images/bg_menuprcpl_current.png)" >Accueil</a></li><ul><li>sous_menu1<li><ul>
<ul></div>
et voici la feuille de style:
.MenuTop {
font-family: Tahoma;
font-size: 10px;
font-weight: normal;
color: #999999;
height:30px;
white-space:nowrap; /*IE hack*/
border:none;
width:1000px;
}
.MenuTop ul {
list-style-type:none;
padding:0;
margin:0;
}
.MenuTop ul li {
list-style:none;
display:block;
float:left;
height:30px;
line-height:38px;
font-family:Tahoma;
letter-spacing:1px;
font-weight: lighter;
z-index:auto !important;
z-index:1000;
font-size:10px;
}
.MenuTop ul li.last {
float:left;
z-index:auto !important;
z-index:1000;
font-size:10px;
background:url(../images/bg_menuprcpl_current.png) repeat-x left;
}
.MenuTop ul li a {
float:none !important;
float:left;
display:block;
height:30px;
line-height:30px;
padding:0 17px 0 18px;
text-decoration:none;
font-weight:bold;
color:#fff;
}
.MenuTop ul li ul {
display:none;
border:none;
}
.MenuTop ul li:hover {
position:relative;
background:url(../images/bg_menuprcpl_current.png) repeat-x left;
}
.MenuTop ul li.last:hover {
position:relative;
background:url(../images/bg_menuprcpl_current.png) repeat-x left;
}
.MenuTop ul li:hover a {
color:#FFF;
}
.MenuTop ul li:hover ul {
display:block;
width:10.0em;
position:absolute;
z-index:999;
top:30px;
/*margin-top:1px;*/
left:0;
}
.MenuTop ul li:hover ul li a {
white-space:normal;
display:block;
width:160px;
height:auto;
line-height:18px;
margin-left:-1px;
border-left:1px solid #CCC;
border-bottom:1px solid #CCC;
border-right:1px solid #CCC;
background-color:#EAEAEA;
font-weight:normal;
font-size:11px;
color:#000;
}
.MenuTop ul li:hover ul li a:hover {
background-color:#FFF;
text-decoration:none;
}
#rubrique_actif {
background:url(../images/bg_menuprcpl_current.png) repeat-x left;
color:#FFF;
margin-left:1px !important;
padding:0 25px;
padding:0 5px 0 5px;
}
.MenuTop table {
position:absolute;
top:0;
left:0;
border-collapse:collapse;
}
.MenuTop ul li ul li a {
text-align:left;
}
.MenuTop ul li a:hover ul li a {
white-space:normal;
display:block;
width:130px;
height:1px;
line-height:18px;
padding:4px 16px 4px 16px;
border-left:solid 1px #CCC;
border-bottom:solid 1px #CCC;
background:none;
background-color:#EAEAEA;
font-weight:normal;
color:#333;
}
.MenuTop ul li a:hover ul li a:hover {
background:#FFF;
background-color:#FFF;
text-decoration:none;
}
.MenuTop ul li ul li a:hover {
background:#FFF;
background-color:#FFF;
text-decoration:none;
}
Cainzer
Messages postés
250
Date d'inscription
mardi 18 août 2009
Statut
Membre
Dernière intervention
19 octobre 2023
56
18 août 2009 à 14:23
18 août 2009 à 14:23
Merci mais je voudrais que le sous menu défile au passage de la souris. Et c'est ça qui pose problème et qui nécessite normalement du javascript. Ou est-ce que j'ai tous simplement mal formé la formule que manelsousse m'a donné ?
