Les bases du CSS : commencer avec les grilles CSS
Rachel Andrew, Web Developer, Speaker and Author
Regardez ce cours et des milliers d'autres
Regardez ce cours et des milliers d'autres
Leçons de ce cours
-
-
1.
Introduction
1:23
-
2.
Présentation des grilles CSS
8:17
-
3.
Définir votre grille
10:33
-
4.
Définir la dimension des lignes
6:23
-
5.
Les grilles imbriquées et le placement des objets
10:56
-
6.
La combinaison du placement manuel et automatique
7:35
-
7.
L'intégration de l'aspect adaptatif
9:23
-
8.
La combinaison des mises en page
3:30
-
9.
Réflexions finales
0:59
-
10.
Découvrez d'autres cours sur Skillshare
0:35
-
-
- --
- Niveau débutant
- Niveau intermédiaire
- Niveau avancé
- Tous niveaux
Généré par la communauté
Le niveau est déterminé par l'opinion majoritaire des apprenants qui ont évalué ce cours. La recommandation de l'enseignant est affichée jusqu'à ce qu'au moins 5 réponses d'apprenants soient collectées.
5 483
apprenants
8
projets
À propos de ce cours
Vous voulez créer des mises en page bidimensionnelles rapides et souples en CSS ? Apprenez comment faire avec les grilles CSS !
Rejoignez la gourou du Web, oratrice et auteure, Rachel Andrew dans ce cours sur les grilles CSS : le système de mise en page le plus puissant qui existe en CSS. Avec les grilles CSS, vous pouvez maintenant définir à la fois des lignes et des colonnes, soit un système bidimensionnel qui ouvre la porte sur un tout nouveau monde de possibilités en matière de mise en page. Tout au long de ce cours, Rachel décompose le principe des grilles CSS et vous présente les incroyables structures adaptatives et flexibles que ces grilles vous permettent d'intégrer dans vos designs.
Les éléments principaux abordés dans ce cours sont les suivants :
- Ajouter des espaces et des bordures avec une seule ligne de code
- Les grilles imbriquées pour créer des superpositions facilement
- La création d'images dites héros en combinant le placement manuel et automatique
- L'intégration d'une fonction d'adaptabilité pour que votre site puisse être visualisé à partir de n'importe quelle résolution d'écran
Que vous découvriez le CSS ou que vous l'utilisiez depuis son apparition, ce cours vous montrera comment créer des mises en page de grande échelle, uniques et asymétriques avec facilité et efficacité. Tout développeur se doit de connaître les grilles CSS. Après ce cours, vous aurez les outils nécessaires pour les intégrer dans vos nouveaux projets.
Rencontrez votre enseignant·e
Rachel Andrew lives in Bristol, England. She is one half of web development company edgeofmyseat.com, the company behind Perch CMS and Notist. Her day to day work can include anything from product development to devops to CSS, and she writes about all of these subjects on her blog at rachelandrew.co.uk.
Rachel has been working on the web since 1996 and writing about the web for almost as long. She is the author or co-author of 22 books including The New CSS Layout, and a regular contributor to a number of publications both on and offline. She is a Google Developer Expert for Web Technologies a W3C Invited Expert to the CSS Working Group, and Editor in Chief of Smashing Magazine. Rachel is a frequent speaker at web development and design events includ... Voir le profil complet
Projet de cours pratique
Publiez votre page de blog !
Que vous suiviez ce cours en utilisant Codepen ou que vous utilisiez votre propre éditeur, nous aimerions voir votre projet. N'hésitez pas à publier des extraits de code ou des réflexions sur les façons dont vous avez envie d'utiliser les grilles CSS.
Ressources
- Pour obtenir davantage de ressources sur le CSS de Rachel Andrew : Grid by Example (site Web en anglais)
- Pour obtenir un compte Codepen gratuit : skl.sh/codepen
Liens d'exercices
- Le point de départ : skl.sh/cssgrid_1
- Définir la dimension des lignes : skl.sh/cssgrid_2
- Les grilles imbriquées et le placement des éléments : skl.sh/cssgrid_3
- La combinaison du placement manuel et automatique : skl.sh/cssgrid_4
- L'intégration de l'aspect adaptatif : skl.sh/cssgrid_5
- Combinaison des mises en page : skl.sh/cssgrid_6
- Page de blog finale : skl.sh/cssgrid_final
Retrouvez Rachel sur son site Web, son compte Twitter et son blog
Découvrez d'autres cours sur Skillshare
- La boîte à outils Javascript complète : pour un meilleur code, plus propre et plus rapide — Christian Heilmann
- Introduction au CSS : ajouter des styles fondamentaux à un site Web de style portfolio — Jenn Lukas
- Design d'UX adaptatif et intelligent : astuces, conseils et techniques ingénieux — Vitaly Friedman
- Programmer des visualisations de données : une boîte à outils de codage pour Processing — Nicholas Felton
Notes attribuées au cours
Pourquoi s'inscrire à Skillshare ?
Suivez des cours Skillshare Original primés
Chaque cours comprend de courtes leçons et des travaux pratiques
Votre abonnement soutient les enseignants Skillshare