Dans cette formation CSS de plus de 1h40, vous allez apprendre à utiliser les grilles CSS, nouveautés de CSS 3 qui vont vous permettre d'intégrer vos sites Web plus rapidement.
Les grilles CSS (CSS Grid) font partie d'un module complet comme Flexbox qui contient donc un ensemble de propriétés qui vous permettront nativement de créer des grilles complètes et adaptées à toutes vos futures intégrations.
Ce module étant relativement récent, il est supporté actuellement pour plus de 90% des utilisateurs actifs du Web. Il est donc recommandé de ne déployer un site qui utilise les grilles CSS que si vous avez une solution secondaire pour le support des plus anciens navigateurs qui ne sont pas compatibles.
Que vous décidiez d'utiliser les grilles CSS dès aujourd'hui ou dans quelques mois lorsque le support sera encore plus large (autour des 95-97% de support selon moi pour ne plus prendre en compte les anciens navigateurs incompatibles), vous allez considérablement améliorer vos développement avec le langage CSS et prendre de l'avance sur votre apprentissage.
Pour comprendre cette formation, des pré-requis sont nécessaires :
- Connaître les bases des langages HTML et CSS
- Maîtriser le responsive design (media queries, unités relatives ...)
Cette formation grille CSS se divise en 3 parties :
- Une première approche des grilles CSS.
- Une deuxième partie consacrée à des propriétés plus poussées pour avoir des grilles parfaitement adaptées à vos projets.
- Un cas pratique pour voir l'utilisation des grilles CSS sur un exemple de dispositions d'articles responsive (vous pouvez voir ce petit projet dans la vidéo d'introduction et dans la galerie d'image plus bas).
Les fichiers utilisés dans cette formations vous sont fournis dans les fichiers sources.
Je reste disponible dans le salon d'entraide pour répondre à vos questions.
Bonne découverte de CSS Grid !
Table des matières de cette formation CSS (durée : 1h48m)
-
Première approche de Grid
- Introduction 00:09:59
- Créer un conteneur 00:11:05
- Gérer les lignes et les colonnes 00:13:20
- Propriétés raccourcies 00:02:58
- Gérer l'espace occupé par un élément 00:12:05
-
Des grilles encore plus complète
- Créer des zones 00:15:55
- Les gouttières 00:06:01
- Alignement de la grille et des éléments de grille 00:08:06
- Comportement de la grille 00:09:37
-
Cas pratique
- Une grille universelle ? 00:08:14
- Cas pratique 00:10:11
- Conclusion 00:01:10
- Fichiers sourcestélécharger
- Certificat
Formateur : Steven Sil
-
J'avais commencé à tester CSS Grid, mais, avec cette formation, les choses paraissent vraiment plus claires. Merci Steven.
-
J'avais acheté un livre sur Grid, mais qui s'est très vite montré "imbuvable" avec des explications nettement trop techniques. Cette formation GRID est tout simplement parfaite, intuitive, comme toutes celles de Steven.
-
Encore une fois, un très bon tuto qui va m'aider dans mes développements futurs. Merci à toi Steven pour ta pédagogie et ta science du tuto ; )
-
Avec quelle version de logiciel ce tuto est-il compatible ?CSS 3
-
Quel est le niveau requis pour suivre ce tuto ?intermédiaire
note moyenne
avis laissés