CATALOGUE Code & Data Formation XHTML/CSS Apprendre CSS 3 Comment Styliser des Boutons dans une Interface Web

Comment Styliser des Boutons dans une Interface Web

Styler les call to action primaires et secondaires
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 de :

  • Montrer comment styliser des boutons de manière efficace.
  • Expliquer l'importance des boutons call-to-action (CTA) dans une interface.
  • Introduire des techniques pour créer des boutons avec des classes CSS et des survols.

Cette leçon vous enseigne comment styler des boutons dans une interface web, notamment les boutons primaires et secondaires.

Les boutons sont essentiels dans une interface web, il est donc crucial de leur attribuer des classes de design pattern. Cette leçon couvre les étapes pour styliser des boutons primaires et secondaires en utilisant CSS. Vous apprendrez à :

  • Convertir des éléments inline en inline-block pour appliquer des marges et des padding.
  • Ajouter des bordures et des arrière-plans aux boutons.
  • Gérer les états de survol avec des sélecteurs CSS.
  • Créer des rapports de taille et de centrage du texte à l'aide du line-height.
  • Créer des variantes de boutons pour les boutons secondaires.

La mise en œuvre de ces techniques garantit une interface utilisateur robuste et intuitivement navigable.

Voir plus
Questions réponses
Pourquoi est-il important de styliser les boutons dans une interface web ?
Il est important de styliser les boutons pour améliorer l'expérience utilisateur en rendant les actions importantes clairement visibles et accessibles.
Quelle est la première étape pour styliser un bouton en CSS ?
La première étape est de convertir l'élément lien en inline-block pour pouvoir appliquer des marges et des paddings.
Comment créer une variante de bouton secondaire en CSS ?
Pour créer une variante de bouton secondaire, vous pouvez cumuler des classes CSS et surclasser les propriétés existantes pour ajuster la taille, les couleurs et les bordures.

Programme détaillé

4 commentaires
4,5
4 votes
5
4
3
2
1
pierre.hiroux
Il y a 9 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 !