Utilisation des Pseudoclasses pour le Style des Boutons
Apprenez à distinguer les styles des boutons en fonction de leurs états avec les pseudoclasses dans Dreamweaver.
Introduction de la formation à Photoshop CC pour le Web
Les raccourcis utiles de Photoshop CC
Création de formes vectorielles, édition de formes
Les réglages élémentaires de Photoshop
Exporter individuellement les images bitmaps pour le Web
Exporter un SVG depuis Photoshop CC
Créer plusieurs versions dune composition Photoshop CC
Réaliser un Gif animé
Réaliser un rollOver CSS
Réaliser un Sprite Sheet (animation pelliculée)
Exporter une page XHTML statique à laide de loutil Tranches
Réaliser une composition HTML5 sémantique à partir de Photoshop
Gérer les styles CSS de formes primitives avec Photoshop
Gérer les styles CSS de textes éditables avec Photoshop
Exporter les calques par lot à laide de lextension Photoshop Generator
Générer automatiquement les icones dune application mobile
Exporter une composition Photoshop vers les autres logiciels Adobe
Réaliser un Gif vidéo
Réaliser un montage vidéo pour le Web avec Photoshop
Détails de la leçon
Description de la leçon
Ce tutoriel présente l'utilisation des pseudoclasses CSS pour styler les boutons en fonction de différents états : link, visited, over et active. Vous apprendrez à attribuer des couleurs spécifiques au texte en fonction de l'état du bouton, ainsi qu'à gérer l'affichage d'images d'arrière-plan à partir d'une image unique subdivisée en trois parties. Vous découvrirez comment utiliser la propriété background-position pour ajuster l'affichage de l'image en fonction de l'état du lien. Le tutoriel est principalement réalisé dans Dreamweaver.
Objectifs de cette leçon
Les objectifs de cette vidéo sont d'apprendre à utiliser les pseudoclasses CSS pour personnaliser les états d'un bouton et à manipuler des images d'arrière-plan en fonction des interactions de l'utilisateur.
Prérequis pour cette leçon
Pour suivre cette vidéo, une connaissance de base de Dreamweaver et des CSS est recommandée.
Métiers concernés
Ces techniques sont particulièrement pertinentes pour les web designers et les développeurs front-end.
Alternatives et ressources
Des alternatives possibles incluent l'utilisation d'autres éditeurs de code tels que Visual Studio Code ou Atom, ainsi que la manipulation directe des CSS dans un fichier HTML.
Questions & Réponses
over est utilisée pour styliser le lien au survol de la souris.
background-position est utilisée pour ajuster l'affichage de l'image d'arrière-plan en fonction de l'état du lien.