Création de menu en css

Bonjour! Je suis debutant dans la création de site web et je ne sais vraiment pas comment proceder pour la création des menus et sous menus suivants:

• menu: Accueil avec sous menus:gagnant,Perdant,Joyeux;
• menu: Service avec sous menus:Marchant,Transport;
• menu: Publicité sans sous menu;

je veux le faire en css3 sous notepad++ mais je n'ai vraiment pas d'idée car j'ai tenté par autres methodes qui n'ont pas marchées:
Venez vraiment à mon sécour.
Voici les premières idées que j'ai essayée mais n'ont pas marché:

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27

ul { padding: 0; margin: 0; list-style-type: none; } Li { margin-left: 2px; float: left; /*pour IE*/ } ul Li a { /*Accueil Services Publicite Apropos*/ display: block; float: left; width: 100px; background-color: #6495ED; color: black; text-decoration: none; text-align: centrer; padding: 5px; border: 2px solid; /*pour avoir UN effet ''outset'' avec IE:*/ border-color: #696969 #696969 #DCDCDC; } ul Li a:hover { background-color: #D3D3D3; border-color: #696969 #DCDCDC #DCDCDC #696969; }

---

Celui qui peut me suivre tout en me donnant le comment ça se passe et ça marche?
Excusez moi de mes erreurs.
Je vous remerci par avance.
Par Zizou7.
NB:J'ai lu assez de tutoriels que je n'arrive vraiment pas à comprendre.

As-tu regardé ici : http://css.developpez.com/cours/?pag...css#navigation ?

Citation:

---

Envoyé par Zizou7

NB:J'ai lu assez de tutoriels que je n'arrive vraiment pas à comprendre.

---

Dans ce cas il vaut mieux apprendre les bases avant de se lancer dans les tutoriels.

Comme kOrt3x vous le mentionne consultez la galerie et postez votre code HTML pour pouvoir être aidé.

J'aimerais savoir s'il faut une page html de format des menus puis une page css qui est liée à la page html pour mettre ces menus horizontalement?
J'aimerais faire ces menus comme en-tête de ma page en tant que debutant.
Aidez moi s'ils vous plait.
Merci par avance.
Par zizou7.

Heu on veut bien vous aidez mais il faut nous en dire plus...

Citation:

---

Envoyé par Zizou7

J'aimerais savoir s'il faut une page html de format des menus puis une page css qui est liée à la page html pour mettre ces menus horizontalement?

---

Ce n'est pas vraiment le moment de penser à cela non ?

Citation:

---

...postez votre code HTML pour pouvoir être aidé.

---

Bonjour,

On n'apprend pas en claquant dans les doigts.

Il faut prendre le temps et commencer par le début : les bases pour apprendre HTML.
Ensuite on peut passer aux bases pour apprendre CSS + faire des exercices simples.

Voici une amélioration de ton code, plutôt simple, et valide CSS3 W3C.
Il y a 'énormes possibilités d'améliorations niveau graphique, mais pour comprendre le code, je pense que c'est un bon début ;)

HTML

Code:

---

1 2 3 4 5 6 7 8 9

<div id="menu"> <ul> <li><a href="">Accueil</a></li> <li><a href="">Service</a></li> <li><a href="">Publicité</a></li> <li><a href="">A Propos</a></li> </ul> </div>

---

CSS

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25

li a { text-decoration : none; } #menu { margin : 0 auto; text-align : center; margin-top : 150px; } ul { padding : 0; margin : 0; list-style-type : none; } li { display : inline; background : #6495ED; padding : 5px; border : black solid 1px; border-radius : 5px; transition : all 0.5s ease-in; } li:hover { background : #D3D3D3; }

---

Voir sur CodePen, avec aperçu :
http://codepen.io/mangasource/pen/dvtpn

N'hésites pas si tu as des questions, j’essaierais d'y répondre de manière compréhensible :)

@mangasource

Il manque les sous-menus. :aie:

Oh god, j'avais mal lu .. x)

EDIT : Un tutoriel existe déjà sur DVP, donc tu peux t'en inspirer : http://red-team-design.developpez.co...eroulant-css3/

Sinon, kOrt3x a déjà donné des liens intéressants :

• Transformer une liste en barre de navigation
• Un menu déroulant animé en CSS3
• Un menu déroulant en CSS3

Citation:

---

Envoyé par Zizou7

NB:J'ai lu assez de tutoriels que je n'arrive vraiment pas à comprendre.

---

• Premiers pas avec les CSS
• Glossaire CSS

C'est sûr qu'il va falloir mouiller la chemise...

Effectivement, le mieux, et le plus utile, serait de voir les cours de bases du CSS, avant de continuer !

Ce ne sera que plus simple pour la compréhension, et pour la suite du développement

Bonjour,
vous avez oublié Des menus déroulants grâce aux CSS qui mène à Voir le résultat.

Mon dieu que de choix :mrgreen:

Merci pour vos differentes interventions.
J'ai eu à réaliser certains menus.
Je vous remerci très bien.
Par Zizou7.

Et donc, le problème est-il résolu ?