Création d'une mise en page web sous CSS Grid - Vidéo Tuto

Une Vidéo la création d'une mise en page web sous CSS Grid
✅ Suivez la formation CSS Grid :
▶ bit.ly/3mOPNpH
➖➖➖➖➖➖➖
Vous allez apprendre dans cette formation CSS Grid la mise en page de vos pages HTML d'une façon simple et facile et vous allez par conséquent maîtriser le responsive sous CSS3.
C'est quoi CSS Grid ?
Une grille CSS (CSS Grid) peut être définie comme un ensemble croisé de lignes verticales et horizontales. La disposition CSS Grid sépare une page en sections principales. La propriété Grid CSS3 propose un système de disposition basé sur une grille comportant des lignes et des colonnes, qui facilite la conception de pages Web sans positionnement ni flottement. La disposition de la grille nous donne un moyen de créer des structures de grille représentées en CSS, pas en HTML.
Similaire au tableau, La CSS Grid permet à un utilisateur d'aligner les éléments en lignes et en colonnes. Mais comparé aux tableaux, il est facile de concevoir la mise en page avec la grille CSS. Nous pouvons définir des colonnes et des lignes sur la grille en utilisant les propriétés grid-template-rows et grid-template-columns.
Un conteneur de grille peut être créé en déclarant display : grid ou display : inline-grid sur un élément. Le conteneur Grid contient les éléments d'une grille qui sont placés à l'intérieur des lignes et des colonnes.
Vous allez apprendre dans cette formation CSS Grid
Dans cette formation, vous allez apprendre à utiliser la technologie du CSS moderne Grid. Vous allez voir les différentes propriétés CSS3 liées à Grid.
Tout d'abord vous allez apprendre ce qu'est un conteneur et ce que sont les contenus. Ainsi vous pourrez comprendre comment il peut être facile de les manipuler en utilisant efficacement la technologie Grid du CSS3.
Vous allez par la suite apprendre à définir des colonnes ainsi que des lignes afin de faciliter la mise en page de nos différents items. Vous pourrez facilement donner une valeur de largeur à nos colonnes ainsi qu'une hauteur à nos lignes et ainsi définir une véritable grille où vous pouvez définir l'emplacement du header, de la nav, de l'article, du footer ou de toute autre boîte que vous aurez définie en HTML.
Vous allez voir également que grâce à la technologie CSS Grid, vous allez pouvoir déplacer très facilement les différents items sur l'écran sans toucher à aucun moment le code HTML.
A la fin de cette formation, vous serez parfaitement opérationnel pour mettre en page n'importe quel site web en utilisant la technologie moderne CSS Grid.
+ Le formateur expert Carl BRISON
Au long de cette formation CSS Grid, vous serez accompagné-e par le formateur Carl BRISON, qui sera votre guide pour maîtriser toutes les notions sur le module CSS Grid. Aussi, il vous dotera des astuces et bonnes pratiques à appliquer dans vos projets en développement de pages web responsives avec CSS3 et HTML.
+ Les bénéfices de laformation CSS Grid
A l'issue de cette formation, vous aurez tous les moyens et connaissances pour créer et mettre en page des site web responsive à l'aide de CSS3 et le module CSS Grid et ainsi vous gagner en compétences professionnelles sans oublier de laproductivité et la performance dans votre carrière de développeur web.
➖➖➖➖➖➖➖
Abonnez-vous à notre chaîne :
▶ kzbin.info?sub_c...
➖➖➖➖➖➖➖
✳️ Le plan de la formation CSS Grid :
01.Présentation de la formation
02.Fonctionnement
03.Les propriétés du conteneur
04.Les propriétés des contenus
05.Alignement des contenus
06.Propriétés complémentaires
07.Application de toute la puissance de Grid
08.Apprendre à travailler efficacement
09.Exercice 1 : Création d'une maquette d'un site responsive
10.Exercice 2 : Création d'un site mobile first
11.Exercice 3 : Création d'un site mobile first
12.Exercice 4 : Création d'un site desktop first
13.Exercice 5 : Création d'un site desktop first
14.Exercice 6 : Vision desktop first, vision mobile first
15.Conclusion
✅ Suivez la formation CSS Grid :
▶ bit.ly/3cv0NE1
➖➖➖➖➖➖➖
Playlist des vidéos gratuites de la formation CSS Grid :
▶ • Formation CSS Grid : M...
➖➖➖➖➖➖➖
🔵 Restez connecté-e :
Alphorm Formations ▶ www.alphorm.com/formations
KZbin ▶ kzbin.info?sub_c...
LinkedIn ▶ / alphorm
Twitter ▶ / alphorm
Facebook ▶ / alphorm.officiel
Quora ▶ www.quora.com/q/eafxbpdmvmsagfpg
#CSS_Grid #mobile_first #desktop_first

[@Alphorm]

✅ Suivez la formation complète : ▶ bit.ly/3mR81XA

[@Spaartann117]

Très bon Tutoriel avec une explication que j'ai directement compris, merci à vous.

[@lessouterrainsoublies9179]

Un grand merci pour tous ces tutos !

[@afoidahmedali9932]

Magnifique tuto merci infiniment, mais pourrai tu fair une tuto concernant grid-template-column et grid-template-row car j'ai des confusion de dedans s'il vous plait