Intégration d'un menu déroulant

Neo57_76

Nouveau membre
Bonsoir, je viens de mettre sur mon site consacré à la F1 une boutique de vente de billet pour ce sport. En plus de ce sport, il va y avoir prochainement d'autre discipline comme la MotoGp, A1 GP, le WTCC etc etc

J'ai donc voulut mettre un menu déroulant, etant une vraie chèvre en programmation html, je me suis dit que j'allais trouvé mon bonheur sur le net grace à google mais tout ce que j'ai trouvé, je n'ai pas réussit à l'intégrer à ma feuille de style css

De ce fait je viens vous demander si quelqu'un sait faire cela et s'il aurait la gentillesse de me le faire ou de m'expliquer comment je dois faire car je ne demande pas mieux que d'apprendre.

Voilà la partie de la feuille de style css qui gére le header

[cpp] /* Valeurs par default Applicables sur toute la page
--------------------------------------------------------------------------------------------------------*/
*{margin:0; padding:0; list-style:none;}
body{font:64% Arial, Helvetica, sans-serif; background:#DADADA; padding:45px 0 20px;}
a{text-decoration:none;color:#444;}
a:hover{color:#00a0fc;}
a img {border:0px none; }

h2{background:url('img/h2.jpg');height:34px;font-size:1.1em;text-align:right;position:relative;text-transform:uppercase;line-height:20px;font-family:Verdana;color:#2c5ab0; padding-left:0; padding-right:20px; padding-top:0; padding-bottom:0}
.tl{position:absolute;top:0;left:0;font-size:0}
.tr{position:absolute;top:0;right:0;font-size:0}
.clear{visibility:hidden;clear:both; min-height:1px}






/* Layout, Structure des Blocks
--------------------------------------------------------------------------------------------------------*/
#wrapper{width:1000px; margin: 0 auto}

#header{background:url('img/header.jpg');height:204px;margin-bottom:20px; position:relative}

#content{width:761px;float:right; padding:0 1px 20px 0;}

#sidebar{width:203px; padding-bottom:20px;}

#footer{background:url('img/footer.jpg') no-repeat;height:57px; clear:both; margin-top:20px}


/* Contenu
--------------------------------------------------------------------------------------------------------*/
/**** Header ****/
#header h1{position:absolute;width:420px;height:50px;left:250px;top:60px; font-size:0}
#header h1 a{display:block;width:100%;height:100%;text-indent:-5000px;}

#header ul#toolbar{position:absolute;top:176px;left:202px;}
#header ul#toolbar li{float:left;}
#header ul#toolbar li a{display:block;width:116px;line-height:23px;margin-right:2px; text-transform:uppercase; text-align:center;color:#e5edf4;font-weight:bold;font-family:Tahoma;font-size:1.1em; letter-spacing:1px;}
#header ul#toolbar li a:hover{color:#c1c1f4;}
#header ul#toolbar li form#searchengine input{border:0px none;background:none}
#header ul#toolbar li form#searchengine input#q{width:93px; font-size:1.1em;margin:6px 0 0 7px;}
#header ul#toolbar li form#searchengine input#sub1{width:12px;height:14px; font-size:0;margin:-4px 0 0; vertical-align: middle; cursor:pointer;}
[/cpp]

Et la programmation htlm du header

[cpp] <div id="header">
<h1><a href="http://www.maxif1.com">MaxiF1.com</a></h1>

<ul id="toolbar">
<li><a href="http://www.maxif1.com" title="Retour à l'accueil">accueil</a></li>
<li>
<a href="#" title="Prochainement sur Maxif1.com">billetterie</a>
</li>

<li><a href="http://www.maxif1.com/Forum" title="Communauté MaxiF1, discutez de la F1, et de tous les sports mécaniques">forum</a></li>
<li><a href="http://www.maxif1.com/Forum/annuaire.php" title="Annuaire des sports mécaniques">annuaire</a></li>
<li><a href="aff_contact.php" title="Contactez le Webmaster">contact</a></li>
<li>
<form id="searchengine" method="get" action="http://www.google.com/search" />
<p>
<input type="text" name="q" id="q" value="Rechercher" onclick="this.value=''" />
<input type="submit" id="sub1" value="" />
<input type="hidden" name="sitesearch" value="maxif1.com" />
</p>
</form>
</li>
</ul>
</div><!-- end #header -->[/cpp]

Il faudrait mettre le menu déroulant sur l'onglet billetterie

Merci de votre aide et de vos conseilles

 

Neo57_76

Nouveau membre
[cpp]<ul id=toolbar><li class="niveau1"><a href="http://www.maxif1.com" title="Retour à l'accueil">accueil</a></li>
<li class="sousmenu"><a href="http://www.global-grand-prix.com/MXF1/fr/" target="_blank" title="Achetez vos tickets pour la F1">billetterie</a>
<ul class="niveau2"><ul>
<li><a href="#">test2</a></li>
<li><a href="#">test</a></li>
</ul></ul>
</li>

<li><a href="http://www.maxif1.com/Forum" title="Communauté MaxiF1, discutez de la F1, et de tous les sports mécaniques">forum</a></li>
<li><a href="http://www.maxif1.com/Forum/annuaire.php" title="Annuaire des sports mécaniques">annuaire</a></li>
<li><a href="aff_contact.php" title="Contactez le Webmaster">contact</a></li></ul>[/cpp]

Avec cette feuille de style

[cpp]/**** Header ****/
#header h1{position:absolute;width:420px;height:50px;left:250px;top:60px; font-size:0}
#header h1 a{display:block;width:100%;height:100%;text-indent:-5000px;}

#header ul#toolbar{position:absolute;top:176px;left:202px;}
#header ul#toolbar li{float:left;}
#header ul#toolbar li a{display:block;width:116px;line-height:23px;margin-right:2px; text-transform:uppercase; text-align:center;color:#e5edf4;font-weight:bold;font-family:Tahoma;font-size:1.1em; letter-spacing:1px;}
#header ul#toolbar li a:hover{color:#c1c1f4;}
#header ul#toolbar li form#searchengine input{border:0px none;background:none}
#header ul#toolbar li form#searchengine input#q{width:93px; font-size:1.1em;margin:6px 0 0 7px;}
#header ul#toolbar li form#searchengine input#sub1{width:12px;height:14px; font-size:0;margin:-4px 0 0; vertical-align: middle; cursor:pointer;}
#header ul#toolbar ul ul{position:relative;top:10;left:100px;display:none;}
#header ul#toolbar li.sousmenu{}
#header ul#toolbar ul.niveau1 li.sousmenu:hover ul.niveau2,
#header ul#toolbar ul.niveau2 li.sousmenu:hover ul.niveau3{display:block;background:green;}[/cpp]

Mais ça marche pas non plus help me please
 
Vous devez vous inscrire ou vous connecter pour répondre ici.
Derniers messages publiés
Statistiques globales
Discussions
730 079
Messages
6 716 712
Membres
1 586 247
Dernier membre
MrAzgarIII
Partager cette page
Haut