Introduction
LES FONDAMENTAUX ET TECHNIQUES AVANCEES DU HTML/XHTML
LES BASES DU HTML5 et les propriétés CSS3 courantes
HTML5 : Les nouvelles et autres balises html5
ANNEXES
Travailler en HTML5 et CSS3 avec les nouvelles balises et propriétés
Les nouveaux API du HTML5 (javascript)
Détails de la leçon
Description de la leçon
Dans cette leçon, nous explorons les propriétés TextShadow et BoxShadow en CSS, qui permettent de créer des ombres sous les textes et les boîtes. Ces propriétés utilisent des valeurs définissant le décalage horizontal et vertical, la zone de flou, et la couleur de l’ombre.
Nous commençons par ajouter une ombre à notre élément 'conseil' avec BoxShadow, en spécifiant différentes valeurs de décalage et de flou pour ajuster l'apparence de l'ombre. Ensuite, nous répétons le processus pour les différents préfixes de navigateurs tels que -moz-, -webkit-, et -o-.
De plus, nous appliquons des ombres aux titres H1 en utilisant la propriété TextShadow. Cette section démontre comment définir des ombres multiples pour créer des effets visuels intéressants, incluant des ombres colorées en relief. Enfin, des solutions de contournement pour Internet Explorer sont présentées à l'aide de filtres Microsoft spécifiques.
Objectifs de cette leçon
Apprendre à utiliser les propriétés TextShadow et BoxShadow.
Comprendre les effets et les paramètres des ombres en CSS.
Acquérir des compétences pour gérer les compatibilités entre navigateurs.
Prérequis pour cette leçon
Connaissances de base en CSS et HTML.
Expérience avec les feuilles de style et la conception web.
Métiers concernés
Développeurs front-end
Web designers
Intégrateurs web
Alternatives et ressources
Utiliser des filtres graphiques avancés.
Recourir à JavaScript pour des effets dynamiques d'ombrage.
Questions & Réponses
Je m'abonne