CSS-Grid : Mise en application
Problème de lecture
Cette vidéo ne semble pas disponible
00:00
00:00
Sous-titres non disponibles
2h18
de formation
32
leçons vidéo
7
chapitres
Débutant
niveau requis
Carl Brison
Carl Brison
Formateur certifié

CSS-Grid : Mise en application

4.8/5 Trustpilot (1392 avis) Satisfait ou remboursé
2h18
de formation
32
leçons vidéo
7
chapitres

Après le tuto sur l'apprentissage théorique de la grille en CSS3, voici un tuto vidéo extrêmement complet sur la mise en application de CSS Grid.

En effet, comme j'aime à le répéter, en informatique pour progresser il faut : pratiquer, pratiquer et encore pratiquer !
Je précise qu'il est indispensable de connaître CSS Grid pour pouvoir suivre ce tuto. Je mets à votre disposition un tuto complet sur l'apprentissage des grilles en CSS3.

Ici nous allons nous placer en situation professionnelle.
Nous recevrons en tout 5 jobs à réaliser. Nous travaillerons tantôt mobile first, tantôt desktop first.
Pour cela, nous utiliseront l'ensemble de nos connaissances acquises au cours du tuto sur l'apprentissage théorique de la grille en CSS3.

Au programme de ce tuto pratique CSS Grid

Vous allez très vite vous apercevoir des uses et automatismes qu'il faut adopter afin de pouvoir mener à bien ces travaux.
Nous allons véritablement nous amuser ! Cela signifie que je vais vous amener sur la compréhension totale et définitive de la technologie CSS Grid ! Vous serez alors un véritable professionnel capable de mettre en page de façon extrêmement rapide et tout en prenant beaucoup de plaisir, n'importe quel design de site Internet.

Bref, vous deviendrez un véritable pro côté Front end !

Avec ce cours de mise en application de CSS Grid, je fournis :

  • un QCM pour tester vos compétences
  • des fichiers de travail
  • un accès à un salon d'entraide pour soumettre vos questions.

Qu’allez-vous apprendre dans ce cours ?

Plan de cours
Chapitre 1
Introduction et rappel
Chapitre 2
Premier job, côté mobile first
Chapitre 3
Second job, côté mobile first
Chapitre 4
Troisième job, côté desktop first
Chapitre 5
Quatrième job, côté desktop first
Chapitre 6
Cinquième job, côté desktop ou mobile first
Chapitre 7
Conclusion

Table des matières

Chapitre 1 : Introduction et rappel

14m57
 
Leçon 1Présentation du tuto
Leçon 2Le viewport
Leçon 3Les points de ruptures
Leçon 4Les medias queries
Leçon 5Le mobile first

Chapitre 2 : Premier job, côté mobile first

28m33
 
Leçon 1Présentation
Leçon 2Mise en place de la structure HTML
Leçon 3Mise en place du CSS pour les smartphones
Leçon 4Mise en place du CSS pour les ordinateurs

Chapitre 3 : Second job, côté mobile first

29m24
 
Leçon 1Présentation
Leçon 2Mise en place de la structure HTML
Leçon 3Mise en place du CSS pour les smartphones
Leçon 4Mise en place du CSS pour les tablettes
Leçon 5Mise en place du CSS pour les ordinateurs
Leçon 6Une grille dans la grille

Chapitre 4 : Troisième job, côté desktop first

13m43
 
Leçon 1Présentation
Leçon 2Mise en place de la structure HTML
Leçon 3Mise en place du CSS pour les ordinateurs
Leçon 4Mise en place du CSS pour les smartphones

Chapitre 5 : Quatrième job, côté desktop first

18m47
 
Leçon 1Présentation
Leçon 2Mise en place de la structure HTML
Leçon 3Mise en place du CSS pour les ordinateurs
Leçon 4Mise en place du CSS pour les tablettes
Leçon 5Mise en place du CSS pour les smartphones

Chapitre 6 : Cinquième job, côté desktop ou mobile first

27m32
 
Leçon 1Présentation
Leçon 2Mise en place de la structure HTML
Leçon 3Desktop first, côté ordinateurs
Leçon 4Desktop first, côté tablettes et smartphones
Leçon 5Mobile first, côté smartphones
Leçon 6Mobile first, côté tablettes et ordinateurs

Chapitre 7 : Conclusion

05m22
 
Leçon 1Conclusion
Leçon 2BONUS :: Mon livre sur l'apprentissage du PHP

Avis des apprenants

Détail des avis
255
Apprenants
23
Commentaires
4,9/5
Note moyenne
5/5
22
4/5
0
3/5
0
2/5
0
1/5
1
Corinne Marchal
Corinne Marchal
Publié le 26/04/2026
Une belle découverte que CSS Grid.
Carl Brison
Carl Brison
Merci beaucoup ;-)
Fred Andenas
Fred Andenas
Publié le 30/01/2026
La mise en place des zones est très bien mise en pratique !!!
Carl Brison
Carl Brison
Merci beaucoup ;-)
Marc Le Person
Marc Le Person
Publié le 03/12/2025
Bon ben on change rien on continu ! exercices pratiques très utiles.Merci.
Carl Brison
Carl Brison
Merci beaucoup pour votre commentaire ;-)

Vos questions sur le cours

Quel est le niveau requis pour suivre ce tuto ?

débutant

Que contient le fichier source ?

Tous les codes sources du tuto.

Deux façons de suivre cette formation

À l'unité
Pour vous former sur ce sujet précis
24,99€
Paiement unique, sans abonnement
Accès à vie à cette formation
2h18 de vidéo • 7 chapitres
Satisfait ou remboursé voir conditions
Accès immédiat après paiement
Avec l'abonnement
Pour progresser en continu
34,90€ /mois
Sans engagement
Cette formation + 6 784 autres en illimité
Plus de 20 nouvelles formations par mois
Résiliable en 1 clic, à tout moment
Commencer avec l’abonnement
Accès immédiat, pendant votre abonnement

Inclus dans les deux formules

  • Hors connexion via l'app Tuto.com
  • Salon d'entraide pour vos questions
  • Certificat de complétion
Paiement sécurisé 1,4 million d'apprenants 4.8/5 Trustpilot
Logo carte-bancaire-monoLogo visa-monoLogo mastercardLogo paypal-monoLogo klarna-monoLogo apple-pay-monoLogo google-pay-mono
Une question avant de choisir ? Écrivez-nous ou appelez le 01 84 80 80 29 (du lundi au vendredi, 10h-12h et 14h-16h)

Formations complémentaires

Les apprenants qui suivent cette formation s'intéressent aussi à :

Abonnement 34,90€/mois

Attendez ! 🤗

Accédez à plus de 1426 tutos gratuits

Notre politique de protection des données