Bundle : Tout savoir ou presque sur le framework CSS BULMA
-30% de réduction
Voici une nouvelle série de tutos vidéo entièrement dédiés à Bulma.
Qu'est-ce que Bulma ?
Bulma est un framework CSS qui permet de faire des mises en pages rapides et efficaces, 100% responsives et de manière beaucoup moins lourde qu'avec Bootstrap. Bulma est en train de prendre beaucoup d'ampleur. Il devient donc intéressant de l'étudier. Surtout pour sa simplicité. Un seul fichier CSS suffit pour faire fonctionner Bulma. A noter que ce framework repose sur Flexbox.
Au programme de ce tuto Bulma dédié aux bases du framework
Dans ce premier volet, nous allons nous familiariser avec le framework.
- Nous allons étudier tout ce qui est formatage d'un document web.
- Nous verrons comment modifier la taille des textes, ainsi que leur couleur.
- Comment les aligner, comment les mettre en gras ou en italique.
- Comment les rendre responsive de façon individuelle.
Nous terminerons ce premier volet par un petit exercice pratique, afin de bien nous familiariser avec nos nouvelles connaissances.
A la fin de ce premier cours Bulma en vidéo, vous connaîtrez toutes les bases nécessaires afin de bien démarrer avec le framework Bulma.
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.
Bonne découverte !
Table des matières de cette formation CSS (durée : 2h51m)
-
Présentation
- A propos de Bulma gratuit 00:03:26
- Installation de Bulma gratuit 00:05:36
-
Manipulation des éléments HTML
- Premières manipulations 00:12:29
- La couleur liées aux boutons 00:05:14
- La largeur liée aux boutons 00:02:39
- Style et état liés aux boutons 00:04:21
- Manipulation des heading 1/2 00:08:40
- Manipulation des heading 2/2 00:06:22
- Manipulation des paragraphes 00:02:50
- Modifier la couleur des textes 00:05:17
- Modifier l'alignement des textes 00:03:19
- Transformation des textes 00:02:35
- Transformation de la largeur des lettres 00:03:42
- Mettre le texte en italique 00:00:54
- Modifier la police 00:02:05
- Conclusion 00:03:31
-
Responsive appliqué aux éléments HTML
- Présentation 00:04:01
- Adaptation des textes en mode responsive 00:09:17
- Réunion de la tablette et du mobile 00:02:31
-
Manipulation des éléments de type block
- Définir une couleur de fond 00:08:56
- Définir des marges 00:07:13
- Définir les types de boîtes 00:07:38
- Cacher des éléments HTML 00:02:35
- Cacher des éléments HTML sous le côté responsive 00:04:19
-
Exercice
- Enoncé gratuit 00:02:51
- Mise en place des titres et sous-titres 00:04:21
- Mise en place des classes Bulma 00:10:14
- Mise en place des contenus des boîtes Div 00:08:39
- Nouveau chapitre sur la classe title 00:03:56
- Manipulation des textes 1/3 00:06:37
- Manipulation des textes 2/3 00:07:18
- Manipulation des textes 3/3 00:04:27
-
Conclusion
- Conclusion 00:03:15
- Fichiers sourcestélécharger
- QCMaccéder
- Certificat
Formateur : Carl Brison
-
Merci Carl, super tuto, j'attends les autres vidéos avec impatience pour aller encore plus loin.
-
Très bon cours, bien amené, qui donne envie de continuer et d'en apprendre plus, vivement la suite. Un instructeur hors pair.
-
Avec quelle version de logiciel ce tuto est-il compatible ?Bulma 0.9
-
Quel est le niveau requis pour suivre ce tuto ?débutant
-
Que contient le fichier source ?Le code source de l'exercice final.
note moyenne
avis laissés