CSS : la Fonction Calc
Problème de lecture
Cette vidéo ne semble pas disponible
00:00
00:00

TUTO CSS : la Fonction Calc

Carl Brison
9,00€

Téléchargement & visionnage illimité

Satisfait ou remboursé

Paiement 100% sécurisé

Dans ce cours en ligne, je vous propose de découvrir la fonction calc() du CSS.
Il s'agit d'une fonction qui permet d'effectuer des calculs que seuls les navigateurs sont capables de comprendre.

En effet, la puissance de la fonction calc() permet de calculer différentes valeurs ayant des unités de mesure différentes.

Au programme de ce tuto sur la fonction Calc en CSS

Dans ce tutoriel en vidéo, je montrerai quelques astuces réservées à la fonction calc() que vous pourrez aisément utiliser dans vos codes CSS.
Une fois la théorie bien acquise, nous terminerons notre formation par un petit exercice pratique.
Ce dernier va consister dans la création d'une grille virtuelle de 12 colonnes, comme le font les frameworks CSS, en utilisant la magie de la fonction calc ainsi que des flexbox.

Un QCM vous sera proposé en fin de formation et vous permettra de valider les connaissances théoriques acquises pendant la formation.
Je reste disponible dans le salon d'entraide pour répondre à vos éventuelles questions sur ce cours.

Pour suivre correctement cette atelier, je recommande de connaître les notions avancées de Flexbox.

Qu’allez-vous apprendre dans ce cours ?

Plan de cours
Chapitre 1
Cours sur la fonction Calc
Chapitre 2
Exercice pratique
Chapitre 3
Conclusion

Plan détaillé du cours

Chapitre 1 : Cours sur la fonction Calc
22m08s
 
Leçon 1Présentation de la fonction calc
Leçon 2Règles à savoir
Leçon 3Mélange des unités
Leçon 4Manipuler la taille des textes
Leçon 5Positionner des éléments HTML
Leçon 6Positionner une boîte horizontalement
Chapitre 2 : Exercice pratique
15m37s
 
Leçon 1Mise en place des bases
Leçon 2Mise en place des 2 premières colonnes
Leçon 3Mise en place des colonnes suivantes
Chapitre 3 : Conclusion
01m22s
 
Leçon 1Conclusion

Avis des apprenants

Détail des avis
14
Apprenants
5
Commentaires
5/5
Note moyenne
5/5
5
4/5
0
3/5
0
2/5
0
1/5
0
Frédéric Dumas
Frédéric Dumas
Publié le 19/08/2023
J'aime beaucoup ce ('ces' devrais-je dire) tuto qui traite d'un point précis. Comme d'habitude, c'est clair, rapide et efficace. Le petit plus bien plaisant, c'est l'exercice pratique. Encore une fois un grand merci !
Carl Brison
Carl Brison
Merci beaucoup, c'est TRES gentil ;-)
Valérie Arno
Valérie Arno
Publié le 22/12/2021
Vos tutos méritent leurs 5 * :-) C'est super et magique la fonction calc. En plus ça limite l'usage des media queries. Tout s'adapte parfaitement aux différentes tailles d'écran. C'est avec un grand plaisir que je la découvre. Et bien sûr avec vos explications très appréciables. Merci Carl !
Carl Brison
Carl Brison
Merci beaucoup pour votre confiance ;-)
Jean-Philippe Eschrich
Jean-Philippe Eschrich
Publié le 24/07/2021
Grace à ce tutoriel, je vais pouvoir mettre en pratique la fonction calc, Merci
Carl Brison
Carl Brison
Merci pour votre commentaire

Vos questions sur le cours

Avec quelle version de logiciel ce tuto est-il compatible ?

CSS

Quel est le niveau requis pour suivre ce tuto ?

débutant

Attendez ! 🤗

Accédez à plus de 1337 tutos gratuits

Notre politique de protection des données