Le Css De A À Z

Apprenez à styliser vos pages

What you'll learn

Le langage CSS de A à Z

La position, display

La couleur les tailles

Unités de mesure

Flexbox

CSS Grid

SASS / SCSS

Faire de multiple projets

Les animations / transitions

etc …

Requirements

Un ordinateur

Un peu de volonté

Description

Bienvenue dans ce cours dédié à l'apprentissage du CSS de A à Z.On va découvrir ensemble ce langage, avec des fichiers que j'ai préparé spécialement pour que tu puisses coder en même temps que la vidéo et ainsi mieux intégrer les différentes leçons.Le cours est également parsemé de projets pratiques pour utiliser directement ce qu'on vient d'apprendre.1. Qu'est ce que le langage CSS ?Le CSS "Cascading Style Sheets" est le langage qui sert à styliser les pages web.C'est grâce à ce dernier qu'on va rajouter des couleurs, du remplissage, des marges, etc …Il fait partie des trois piliers du web que sont l'HTML, le CSS et le JavaScript.On ne peut pas se permettre de passer à côté, ni de minimiser son importance.Sans de solides connaissances en CSS, on va au devant de nombreux problèmes sur nos pages web.2. Qu'allons nous voir dans ce cours ?Voici les différentes parties de cette formation complète :Les bases (Couleur, taille, marge, modèle de boîte).Théorie (Cascade, responsive, performances)Découverte des propriétés importantesAnimation et transitionFaire du responsive en CSSNotions avancéesFlexboxCSS GridLe préprocesseur sassEt on terminera le cours en construisant un site de A à Z.Beau programme n'est ce pas ?On se donne rendez-vous de l'autre côté pour ces 7h de cours !

Overview

Section 1: Introduction

Lecture 1 Introduction

Lecture 2 Qu'est ce que le CSS ?

Lecture 3 Éditeur, code source

Lecture 4 Ressources

Lecture 5 *Facultatif* Rappel de base HTML

Section 2: Les bases

Lecture 6 Déclarer son CSS

Lecture 7 Les ID's et les classes

Lecture 8 Les couleurs

Lecture 9 La taille en CSS

Lecture 10 La marge, le remplissage(padding), les bordures …

Lecture 11 Le modèle de boite

Lecture 12 Les différents "Display"

Lecture 13 Faire une image responsive

Lecture 14 Défi : Faire une carte

Lecture 15 Résolution

Lecture 16 Le "Background"

Lecture 17 Faire un Background étirable

Lecture 18 Gérer le texte

Lecture 19 Projet accueil responsive

Lecture 20 Résolution

Section 3: Théorie, comment le CSS fonctionne ?

Lecture 21 Piliers CSS

Lecture 22 La Cascade en CSS

Lecture 23 La spécificité

Lecture 24 Héritage

Section 4: Plus en profondeur

Lecture 25 La position

Lecture 26 Les sélecteurs

Lecture 27 Les sélecteurs partie 2

Lecture 28 Les unités de mesure

Lecture 29 Les pseudos classes

Lecture 30 Les pseudos éléments

Lecture 31 Float + le bug des floats

Lecture 32 Propriétés en vrac

Lecture 33 Projet : Img et texte

Section 5: Animations et Transitions

Lecture 34 La propriété "Transform"

Lecture 35 Les transitions

Lecture 36 Animation

Lecture 37 Projet Overlay

Lecture 38 Projet animation de bouton

Section 6: Le "responsive" en CSS

Lecture 39 Qu'est ce que le responsive ?

Lecture 40 Les médias queries

Lecture 41 Le texte responsive

Section 7: Apprendre Flexbox

Lecture 42 Mise en place et propriétés de base

Lecture 43 Centrer avec Flexbox, justy-content et align-items

Lecture 44 Align-content et wrap

Lecture 45 Ordre et flex-direction

Section 8: Notions avancées

Lecture 46 Les préfixes CSS "vendors"

Lecture 47 Les tableaux

Lecture 48 La fusion des marges

Section 9: CSS Grid

Lecture 49 Création de notre première grille

Lecture 50 Repeat et Fractionnal Unit

Lecture 51 Placement avec Grid-Row et Grid-Col

Lecture 52 Placement sur plusieurs cellules

Lecture 53 Nommer Colonnes et rangés

Lecture 54 Nommer une "area"

Lecture 55 Grille explicite et grille implicite

Lecture 56 Aligner et centrer ces cellules

Lecture 57 Aligner et centrer sa grille

Lecture 58 Max-content et Min-content

Lecture 59 Autofill, autofit et la fonction MinMax

Section 10: Le préprocesseur SASS

Lecture 60 Mise en place

Lecture 61 Les variables et le nesting

Lecture 62 Les Mixins

Lecture 63 Fonction SASS

Lecture 64 "Extend"

Lecture 65 Les paramètres

Lecture 66 Utiliser une boucle "for"

Lecture 67 Error, warn et debug

Lecture 68 Segmenter son code

Section 11: Projet final

Lecture 69 Téléchargement

Lecture 70 Mise en place

Lecture 71 HTML de la navbar

Lecture 72 Navbar SCSS

Lecture 73 Accueil

Lecture 74 Section texte et image HTML

Lecture 75 Partie SCSS texte et image

Lecture 76 Portfolio HTML

Lecture 77 Portfolio SCSS

Lecture 78 Section Parallax

Lecture 79 Formulaire HTML

Lecture 80 Style du formulaire et footer

Lecture 81 Menu responsive

Développeurs web,Étudiants,Personne en reconversion,Amateur de dev web,Front,Back