Apprendre à réaliser un Menu Responsive multi niveaux
Problème de lecture
Cette vidéo ne semble pas disponible
00:00
00:00
Sous-titres non disponibles

TUTO Apprendre à réaliser un Menu Responsive multi niveaux

Carl Brison
24,99€
Acheter maintenant, payer plus tard. En savoir plus

Téléchargement & visionnage illimité

Satisfait ou remboursé

Paiement 100% sécurisé

Dans ce tuto CSS, je vous propose d'apprendre à réaliser un menu responsive comportant plusieurs sous-menus.
Cela signifie que nous mettrons en place des menus qui au survol de la souris, ouvriront une liste de sous-menus qui elle-même pourra ouvrir une autre liste de sous-menus.

Pour réaliser cela, nous utiliserons uniquement les langages HTML et CSS. Nous n'utiliserons pas de langage de programmation tel que le JavaScript.
Afin de mener à bien notre code, nous devrons mobiliser un certain nombre de connaissances en CSS.
Toutes ces connaissances vous ont déjà été proposées dans différents tutos, par mes soins.

Voici les connaissances que nous devrons exploiter :

Comme j'aime à le répéter : "Plus j'ai de connaissances et plus c'est facile !"

À la fin de ce tuto, vous serez en mesure de réaliser une zone de navigation responsive, comportant plusieurs niveaux de menus.
Je mets les codes de ce tuto à votre disposition ainsi qu'un QCM pour valider vos connaissances !

Qu’allez-vous apprendre dans ce cours ?

Plan de cours
Leçon 1
Mise en place de la zone header
Leçon 2
Positionner les zones droite et gauche
Leçon 3
Mettre en forme la zone nav
Leçon 4
Positionner la zone nav pour les petits écrans
Leçon 5
Installer une icone de menu
Leçon 6
Manipuler l'icone du menu
Leçon 7
Ajouter une nouvelle icone

Plan détaillé du cours

Leçon 1Mise en place de la zone header
10m20
Leçon 2Positionner les zones droite et gauche
05m08
Leçon 3Mettre en forme la zone nav
06m05
Leçon 4Positionner la zone nav pour les petits écrans
05m26
Leçon 5Installer une icone de menu
07m13
Leçon 6Manipuler l'icone du menu
03m42
Leçon 7Ajouter une nouvelle icone
05m36
Leçon 8Créer un sous-menu
07m11
Leçon 9Faire apparaitre et disparaitre le sous-menu
06m53
Leçon 10Améliorer l'apparition du sous-menu
03m17
Leçon 11Préparer un second sous-menu
05m54
Leçon 12Créer le second sous-menu
04m04
Leçon 13Utiliser un combinateur
04m42
Leçon 14Créer un nouveau sous-menu
04m20
Leçon 15Modifier la couleur des flèches
01m31
Leçon 16Dynamiser la largeur du menu
04m31
Leçon 17Définir la place des sous-menus
06m03
Leçon 18Modifier le fonctionnement des sous-menus
02m46
Leçon 19Mettre en place des espaces visuels
05m29
Leçon 20Pour aller plus loin
02m14

Avis des apprenants

Détail des avis
27
Apprenants
1
Commentaire
5/5
Note moyenne
5/5
1
4/5
0
3/5
0
2/5
0
1/5
0
Valérie Arno
Valérie Arno
Publié le 07/05/2024
Super tuto très attendu :-) Je ne pensais pas pouvoir faire un tel menu rien qu'en CSS. J'ai souvent essayé d'en faire un mais j'ai vite abandonné. Vous avez réglé les affichages des sous-menus d'une main de maître. Et toujours sereinement. Bravo ! Et un grand merci. À bientôt Carl.
Carl Brison
Carl Brison
Merci beaucoup Valérie. Oui, celui là, Je l'ai fait pour vous ;-)

Vos questions sur le cours

Avec quelles versions de logiciels ce tuto est-il compatible ?

CSS , HTML

Quel est le niveau requis pour suivre ce tuto ?

débutant

Payer plus tard

Prix d'achat : 24,00 €
Pour payer plus tard, sélectionnez Klarna comme moyen de paiement lors du règlement.

Ajoutez des articles à votre panier

Sélectionnez Klarna lors du règlement

Recevez une autorisation

Payez dans 30 jours

Klarna : conditions d'utilisation du paiement différé.

Attendez ! 🤗

Accédez à plus de 1422 tutos gratuits

Notre politique de protection des données