Apprendre à Styliser avec HTML et CSS

La page d'accueil - partie 2
Vidéo non disponible ! Réessayez plus tard
Cette vidéo fait partie de la formation
Apprendre CSS 3
Revoir le teaser Je m'abonne
4,5
Transcription

89,00€ Je commande

Formation incluse dans l'abonnement Elephorm Je m'abonne à Elephorm

DescriptionProgrammeAvis
4,5
89,00€ Je commande

Formation incluse dans l'abonnement Elephorm Je m'abonne à Elephorm

Les objectifs de cette vidéo sont :
- Comprendre l'utilisation des classes CSS pour styliser les éléments HTML.
- Apprendre à utiliser Flexbox pour des mises en page flexibles.
- Savoir comment centrer du texte et ajouter des espaces autour des éléments.
- Personnaliser des boutons avec des styles CSS.

Découvrez comment utiliser les classes et les propriétés CSS pour créer un design propre et centré grâce à Flexbox.

Dans cette leçon, nous détaillons les étapes pour styliser des éléments HTML en utilisant des classes spécifiques et les propriétés CSS adéquates. Nous abordons la création d'une mise en page flexible en utilisant Flexbox, une méthode moderne et puissante pour aligner les éléments de manière efficace. Vous verrez comment appliquer des styles de fond, ajouter des marges et des paddings, et centrer du texte. Cette leçon met aussi l'accent sur la personnalisation des boutons avec des classes CSS et des états de survol (hover).

En pratique, nous avons utilisé une classe More pour colorier nos éléments, et une classe Flex pour disposer les éléments côte à côte. Nous avons ensuite appliqué des styles directement sur les classes parent pour un contrôle fin du design, comme la couleur de fond bleue et le centrage du texte. Nous avons également vu comment espacer les éléments enfants avec des paddings de 40 pixels de chaque côté.

Enfin, nous avons stylé des boutons avec les classes BTN et BTN Secondary, en ajoutant des couleurs et des bordures pour leurs états de base et de survol. Cette leçon est donc une excellente introduction à la création de mises en page flexibles et esthétiques avec HTML et CSS.

Voir plus
Questions réponses
Qu'est-ce que la classe Flex fait pour les éléments HTML ?
La classe Flex permet de disposer les éléments HTML les uns à côté des autres en utilisant Flexbox.
Pourquoi utiliser des paddings autour des éléments ?
Les paddings créent des espaces autour des éléments, améliorant ainsi la lisibilité et l'organisation visuelle de la page.
Comment personnaliser l'apparence d'un bouton en CSS ?
On peut personnaliser les boutons en CSS en changeant leur background color, en ajoutant ou en supprimant des bordures, et en définissant des couleurs pour les états de survol.

Programme détaillé

4 commentaires
4,5
4 votes
5
4
3
2
1
pierre.hiroux
Il y a 6 months
Commentaire
La formation est divisée en 90 modules sans lien entre eux et sans progression pédagogique. Il faut les réorganiser par thème pour donner plus de cohérence et donner de la progression pédagogique à la formation. Multiples fautes d'orthographe dans les textes.
henridjithat
Il y a 1 year
Commentaire
Très bonne formation, étant débutant j'ai beaucoup appris.
yvan.vogel
Il y a 2 years
Commentaire
J'en suis arrivé au bout.. Un vrai marathon. Très longue formation, à mon avis c'est plutôt 30h de cours et non pas 15h.
Après c'est une formation hyper claire et détaillée. L'auteur a fait un panorama complêt sur le CSS3.
g.vanleynseele
Il y a 4 years
Commentaire
Cours très clair et très bien expliqué! Par contre il manque la moitié des fichiers de travail !