Styler les Recettes avec CSS

Les contenus contextuels
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

L'objectif de cette vidéo est d'enseigner aux utilisateurs à créer et appliquer des classes de design pattern en CSS pour obtenir des effets visuels interactifs et dynamiques.

Découvrez comment utiliser des classes de design pattern en CSS pour styler des éléments et créer des effets visuels interactifs sur une page de recettes.

Dans cette leçon, nous allons apprendre à styler des recettes en utilisant des classes de design pattern en CSS. Nous commencerons par créer une classe Product et l'appliquerons à chaque article de notre section. Ensuite, nous vérifierons la position de différents éléments dans l'inspecteur pour les aligner correctement et créer un effet visuel au survol. Nous ajusterons également les propriétés de style telles que font-weight, padding et margin pour améliorer l'apparence des titres. En utilisant des techniques comme position relative et position absolute, nous démontrerons comment créer des zones d'interaction dynamique. Enfin, nous ajouterons des effets CSS pour modifier les couleurs de fond et de bordure lors du passage de la souris, optimisant ainsi l'expérience utilisateur.

Voir plus
Questions réponses
Quelle est l'importance de la position relative en CSS ?
La position relative en CSS est importante car elle sert de point de référence pour les éléments enfants en position absolue, permettant de créer des designs complexes et interactifs.
Comment le background color et l'opacité peuvent-ils améliorer l'interactivité d'une page web ?
Le background color et l'opacité peuvent créer des effets visuels riches, tels que des surbrillances au survol, qui améliorent l'interactivité et l'expérience utilisateur d'une page web.
Pourquoi utiliser la propriété display inline-block sur un élément ?
La propriété display inline-block permet de combiner les caractéristiques des éléments en ligne et en bloc, offrant la possibilité de gérer les dimensions tout en permettant que le texte et d'autres éléments entourent l'élément comme s'il était en ligne.

Programme détaillé

4 commentaires
4,5
4 votes
5
4
3
2
1
pierre.hiroux
Il y a 10 mois
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 an
Très bonne formation, étant débutant j'ai beaucoup appris.
yvan.vogel
Il y a 2 ans
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 ans
Cours très clair et très bien expliqué! Par contre il manque la moitié des fichiers de travail !