Découvre tous les secrets de la mise en page grâce au CSS by Thomas Giraud

Découvre tous les secrets de la mise en page grâce au CSS

Couleurs, fonds, textes, transformations, animations, variables ou inspecteur : Prépare-toi à devenir une vraie star du design sur le web.

Tu te demandes comment certains sites web peuvent avoir un si beau rendu ?

Sache que le CSS ne rendra pas ton site beau par magie : C'est l'utilisation que tu vas en faire qui fera la différence.

Tu as bien compris, il ne faut pas se contenter d'apprendre bêtement chaque notions. Il faut les combiner pour arriver à des résultats magnifiques.

Heureusement, tu es bien tombé, le CSS c'est ma grande spécialité !

Commencer avec le CSS peut sembler facile mais le CSS est en fait très (très très) profond. C'est pourquoi je vais te proposer un parcours bien pensé du début jusqu'à la fin pour ne rien louper de ce merveilleux langage.

Ce cours couvre tout : nous commençons par les bases en découvrant ce qu'est le CSS et à quoi il sert, comment il fonctionne et comment nous l'utilisons.

Plus nous avancerons, plus nous nous plongerons dans des sujets de plus en plus approfondis.

Comme d'habitude, nous le ferons en montrant à la fois des exemples pratiques et théorique pour couvrir chaque notions.

Le CSS ne sert pas seulement à appliquer de simples styles à nos pages web, il sert à leur donner vie !

Ce n'est pas qu'une simple façon de mettre de la couleur mais un langage complet pour refléter toute la puissance de ta marque, entreprise ou projet !

Ce cours est divisé en 3 parties :
  • Comprendre toutes les bases de CSS et les outils ;
  • Les propriétés générales qui te serviront partout ;
  • Les propriétés poussées qui te permettront de dompter le langage à tout jamais.

Prêt à exploser toutes les limites du design sur le Web ?

À qui s'adresse ce cours ?

Ce cours s'adresse principalement à toi si :
  • Tu veux apprendre et coder en CSS ;
  • Tu n'as aucune connaissance en CSS ;
  • Tu es impatient de découvrir toutes les dernières fonctionnalités CSS ;
  • Tu as mal compris certains concepts propres au CSS ;
  • Tu veux améliorer tes compétences en CSS et couvrir toutes les notions.

Quels sont les Pré-requis ?

Aucune connaissance en CSS n'est requise ! Tu apprendras absolument tout dans ce cours.

Tu as seulement besoin de :
  • Bases dans le langage HTML
Mais si tu n'en a pas c'est pas grave, tu auras accès à une remise à niveau !

  • Une dose de motivation ;
  • Une envie d'apprendre et se former ;
  • Un ordinateur ;
  • Une tasse de café ☕️ ;

... Et laisse toi guider !

Une fois ce cours terminé, tu seras capable de :

🍺  Comprendre comment fonctionne le design sur le web ;
🍺  Utiliser l'inspecteur Chrome comme un dieu afin d'effectuer toutes les modifications de ton choix ;
🍺  Comprendre la dernière version du langage CSS dans son intégralité ;
🍺  Donner vie à n'importe laquelle de tes idées, des tes envies ou tes inspirations ;
🍺  Construire des sites web magnifiques composés d'un bon contenu mais surtout d'une allure qui déchire ;
🍺  Structurer n'importe quel fichier CSS pour construire des pages web propres et optimisées ;
🍺  Comprendre les systèmes plus poussés du CSS que certains développeurs Web ne maîtrisent toujours pas ;
🍺  Et bien plus encore !

Détail de chaque module :

Introduction
Bienvenue dans ce cours !
4 min
À quoi sert le CSS ?
10 min
Comment écris-t-on du CSS ? Syntaxe !
2 min
3 façons d'intégrer du CSS et celle que nous allons utiliser
5 min
Qu'est-ce qu'un Sélecteur et comment l'utiliser ?
9 min
Comment s'organise le système de parenté en CSS ?
4 min
Comment et pourquoi utiliser l'inspecteur de son navigateur ? Découverte de la console Chrome !
5 min
Quel est le processus de mise en forme d'un élément en CSS ?
3 min
Quelles sont les unités de mesure en CSS ?
9 min
Comment utiliser les couleurs ? 3 façons d'utiliser les couleurs en CSS !
6 min
Propriétés générales
Les bases du CSS - Ajout de commentaires et styles de texte
13 min
Comment ajouter de la marge intérieure et extérieure à l'élément ?
6 min
Comment gérer les hauteur et largeur de nos éléments ?
5 min
Deviens flemmard ! À la découverte des propriétés raccourcies
3 min
Comment ajouter des couleurs ou des images de fond ?
8 min
Comment créer des bordures en CSS ?
6 min
Comment appliquer du styles à nos liens ? Et en faire de vrais boutons !
2 min
Comment mettre en forme nos listes ?
3 min
Comment rendre une table stylée ?
6 min
Comment utiliser la propriété Display et à quoi sert-elle ?
5 min
Comment positionner nos éléments à n'importe quel endroit sur notre page web ?
10 min
Que faire si les enfants d'un conteneurs dépassent de ce dernier ? À la découverte des Overflows !
5 min
Comment placer des éléments sous ou sur d'autres éléments ?
4 min
Comment gérer l'opacité en CSS ? 2 méthodes !
5 min
Comment ajouter de l'ombre à nos textes et à nos blocs ?
6 min
Propriétés poussées
Comment et dans quels cas utiliser les filtres en CSS ?
4 min
À quoi servent les variables en CSS ?
6 min
Qu'est-ce qu'une Pseudo-Class et comment l'utiliser ? La gestion des événements en CSS !
10 min
Comment appliquer du style grâce aux pseudo-éléments ?
6 min
Comment intégrer des polices personnalisées sur notre site ?
5 min
Comment utiliser les transformations 2d et 3d en CSS et les appliquer sur nos éléments ?
8 min
Comment donner du charme à nos effets grâce aux transitions ?
5 min
Comment éviter les erreurs et viser les enfants grâce aux Combinateurs ?
10 min
Comment appliquer du style en fonction de la taille de l'écran ? Découverte des media-queries !
11 min
Comment donner vie à son site web grâce aux animations en CSS ?
12 min
RESSOURCES
SLIDES_DECK
1,08 Mo

🎁 Les bonus, les bonus !

  1. Accès au groupe privé d'entre-aide. Nous sommes là pour répondre à toutes tes questions ;
  2. Nous adaptons le cours en fonction de tes demandes ;
  3. Un module est consacré au résumé de toutes les bonnes pratiques à retenir en CSS afin d'être toujours au top ;
  4. Tu auras accès aux slides (diaporama) de tout le cours ;
  5. Tu auras accès au code que nous allons créer ;
  6. Toutes les vidéos théoriques sont découpées en 2 parties : Théorie sur slide  |  Pratique sur page web ;
  7. Toutes les vidéos sont tournées dans la joie et la bonne humeur, tu vas à ton rythme.
    On est entre nous ! 

Découvre tous les secrets de la mise en page grâce au CSS