Le CSS Moderne
Problème de lecture
Cette vidéo ne semble pas disponible
00:00
00:00
Sous-titres non disponibles
6h10
de formation
41
leçons vidéo
3
formations
Débutant
niveau requis
Steven Sil
Steven Sil
Formateur certifié

Le CSS Moderne

Promo -31%
4.7/5 Trustpilot (1395 avis) Satisfait ou remboursé
6h10
de formation
41
leçons vidéo
3
formations

Voici un bundle de 3 formations complètes CSS qui ont pour but de vous faire progresser dans vos intégrations avec CSS en plus de 6 heures de vidéos.
 
Si vous êtes un débutant avec le langage CSS ou que vous souhaitez tout simplement améliorer vos compétences, ce pack vous ait spécialement dédié puisqu’il ne faut connaître que les bases du langage pour assimiler parfaitement le contenu de ces 3 formations.
 

Au programme de cette formation CSS approche moderne

 Ce pack comprend donc les 3 formations suivantes à un prix plus intéressant :

 

A la découverte du Responsive Design (2h43)

Actuellement, les sites Web sont consultés à plus de 50% par des téléphones mobiles, à 7% par des tablettes et à plus de 40% par des ordinateurs. Cet usage grandit au fur et à mesure des mois (+ 10% de visite via des smartphones entre janvier 2017 et décembre 2017 en France).
 
Il est donc important pour chaque site, d’adapter son contenu et la disposition de celui-ci en fonction de la taille de l’écran qui l’affiche. C’est ce qu’on appelle le Responsive Web Design et le but de cette formation est de vous y former.
 
Un projet concret : Nous viendrons réaliser un site onepage qui s’adaptera à toutes les tailles d’écran.

 

Comment fonctionne l'intégration CSS avec Flexbox ? (1H00)

Vous allez apprendre à utiliser le module CSS 3 Flexbox qui va vous permettre d'intégrer vos futurs sites Web avec la plus grande des facilités.
 
Finie l'utilisation des flottants ou encore des display inline-block pour gérer l'intégration de vos designs ! Vous allez enfin avoir un ensemble de propriétés CSS pour gérer l'intégralité de la disposition de vos éléments HTML. Associée à la maîtrise du responsive design que vous aurez vu dans une des autres formations du bundle, Flexbox sera le module parfait pour gérer l'affichage de vos éléments aux différentes tailles d'écrans.

 

Du CSS dopé avec Sass : Formation complète (2h25)

Vos documents CSS vous paraissent difficilement maintenables avec leurs centaines (milliers?) de lignes ? Vous voulez améliorer les capacités du langage CSS en y ajoutant des variables, des fonctions, un héritage des classes ... ?
 
Cette formation Sass en vidéo répondra à toutes vos questions (et même plus encore).
 
Un projet concret : Nous réaliserons une grille responsive complète que vous pourrez utiliser pour l’intégration de tous vos futurs projets Web.

 

L’objectif de ce bundle est de vous permettre de passer à un niveau supérieur en CSS pour vos futures intégrations. Entre l’apprentissage du responsive design et de Flexbox ainsi que l’utilisation du préprocesseur Sass, vous n’aurez plus l’impression de travailler avec le même langage qu’auparavant.
 
Je reste disponible dans le salon d'entraide pour répondre à vos questions.
Tous les fichiers de travail sont fournis avec ce cours.

 
 

Cours dans ce bundle

A la découverte du Responsive Design Cours 1

A la découverte du Responsive Design

Comment fonctionne l'intégration CSS avec Flexbox ? Cours 2

Comment fonctionne l'intégration CSS avec Flexbox ?

Du CSS dopé avec Sass : Formation complète Cours 3

Du CSS dopé avec Sass : Formation complète

Plan détaillé des cours

 

Chapitre 1 : Ce qu'il faut savoir

1h43
 
Leçon 1Introduction
Leçon 2Le responsive design
Leçon 3Le document HTML de base
Leçon 4Media types et media queries
Leçon 5Utiliser les unités relatives
Leçon 6Organiser un projet avec le mobile first
Leçon 7Gérer les textes
Leçon 8Des médias flexibles
Leçon 9Des images adaptatives
Leçon 10Initiation à Flexbox
Leçon 11Créer une grille responsive avec Flexbox

Chapitre 2 : Cas concret : Une landing page responsive

1h
 
Leçon 1Préparation de notre projet
Leçon 2Le header
Leçon 3Les compétences
Leçon 4Le formulaire d'abonnement à la Newsletter
Leçon 5Le footer
Leçon 6Conclusion
 
Leçon 1

Introduction

01m23
Leçon 2

Créer un conteneur Flexbox

11m54
Leçon 3

Direction des éléments flexibles

06m28
Leçon 4

Alignement des éléments flexibles

12m34
Leçon 5

Les pouvoirs du margin: auto

09m19
Leçon 6

Ordre et alignement individuel des éléments flexibles

05m17
Leçon 7

Gérer la taille d'un élément flexible

12m53
Leçon 8

Conclusion

27s
 

Chapitre 1 : Les bases

58m22
 
Leçon 1Introduction
Leçon 2Installation de Sass sur macOS et Windows (update novembre 2019)
Leçon 3Installation de Sass sur macOS et Windows
Leçon 4Compiler un fichier et découverte du projet de grille responsive
Leçon 5Inbrication de sélecteurs et de propriétés
Leçon 6Les variables

Chapitre 2 : Notions intermédiaires

1h11
 
Leçon 1Les mixins
Leçon 2Les fonctions
Leçon 3Importation de fichiers
Leçon 4Extension de règles CSS
Leçon 5Les drapeaux
Leçon 6Les mathémathiques avec professeur Steven
Leçon 7Les structures conditionnelles et finalisation de la grille responsive

Chapitre 3 : Notions avancées

17m56
 
Leçon 1Débogage et opérateurs booléens
Leçon 2Extensions de placeholders
Leçon 3La directive @at-root
Leçon 4Conclusion

Avis des apprenants

Détail des avis
394
Apprenants
4
Commentaires
4,8/5
Note moyenne
5/5
3
4/5
1
3/5
0
2/5
0
1/5
0
Nacer Mouterfi
Nacer Mouterfi
Publié le 31/05/2020
Bonjour Steven, Une parfaite formation riche surtout très bien expliquée. Toutefois, la partie Flexbox intitulée ''Créer une grille responsive avec Flexbox'' ne devrait-elle pas être mise à jour avec le CSS Grid ? Selon ton expression le Css Grid est le Css de demain. A moins qu'il y a quelque chose qui m'échappe sur le plus commercial.... Personnellement, j'aurai aimé pour ce genre de belles formations dans les technos évoluent vite à ce qu'elles soient mises à jour de sorte à donner un plus aux personnes en désir de formations de Web ou autres. Cela dit, malheureusement, plusieurs formations sans grandes utilités sont encore en ligne sur le site tuto.com. Oui le nom de la formation est nommée CSS MODERNE mais elle ne l'est plus complètement . Juste un point qui me taraude sur tuto.com. Désolé sinon Steve. Mes amitiés
Jean-Philippe Santos De Jesus
Jean-Philippe Santos De Jesus
Publié le 27/05/2020
Super Tuto, encore merci.
Par contre, je viens de terminer le module Sass, il aurait été bien que celui-ci soit a jour avec les dernières évolutions de Sass : les commandes ne sont les plus mêmes (ex : commande de style ou de sourceMap) , et la doc est complètement différentes (celle-ci sont maintenant disposées par module)
Steven Sil
Steven Sil
Merci à vous ! :)
Linda Jannet
Linda Jannet
Publié le 15/10/2018
Excellente formation. Beaucoup de pédagogie.
Steven Sil
Steven Sil
Merci :)

Vos questions sur le cours

Quel est le niveau requis pour suivre ce tuto ?

débutant

Deux façons de suivre cette formation

À l'unité
Pour vous former sur ce sujet précis
53,99€ 37€
Promo -31%
Paiement unique, sans abonnement
Accès à vie à cette formation
6h10 de vidéo
Satisfait ou remboursé voir conditions
Accès immédiat après paiement
Avec l'abonnement
Pour progresser en continu
34,90€ 27,91€ /mois
Le 1er mois, puis 34,90€ - sans engagement
Cette formation + 6 788 autres en illimité
Plus de 20 nouvelles formations par mois
Résiliable en 1 clic, à tout moment
Profiter de l'offre
Accès immédiat, pendant votre abonnement

Inclus dans les deux formules

  • Hors connexion via l'app Tuto.com
  • Salon d'entraide pour vos questions
  • Certificat de complétion
Paiement sécurisé 1,4 million d'apprenants 4.7/5 Trustpilot
Logo carte-bancaire-monoLogo visa-monoLogo mastercardLogo paypal-monoLogo klarna-monoLogo apple-pay-monoLogo google-pay-mono
Une question avant de choisir ? Écrivez-nous ou appelez le 01 84 80 80 29 (du lundi au vendredi, 10h-12h et 14h-16h)

Formations complémentaires

Les apprenants qui suivent cette formation s'intéressent aussi à :

Abonnement 34,90€/mois

Attendez ! 🤗

Accédez à plus de 1426 tutos gratuits

Notre politique de protection des données