Attribut text-shadow CSS
- Page précédente text-overflow
- Page suivante text-transform
Définition et utilisation
L'attribut text-shadow applique une ombre au texte.
Voir également :
Tutoriel CSS3 :Effets de texte CSS3
Guide de référence HTML DOM :textShadow attribut
Exemple
Effet de texte d'ombre de base :
h1
{
text-shadow: 5px 5px 5px #FF0000;
}
Plus d'exemples en bas de la page.
Syntaxe CSS
text-shadow: h-shadow v-shadow blur color;
Remarque :L'attribut text-shadow ajoute une ou plusieurs ombres au texte. Cet attribut est une liste d'ombres séparées par des virgules, chaque ombre ayant deux ou trois valeurs de longueur et une valeur de couleur optionnelle. Les valeurs omises sont 0.
Valeur de l'attribut
| Valeur | Description | Test |
|---|---|---|
| h-shadow | Obligatoire. Position horizontale de l'ombre. Permet les valeurs négatives. | Test |
| v-shadow | Obligatoire. Position verticale de l'ombre. Permet les valeurs négatives. | Test |
| blur | Optionnel. Distance de flou. | Test |
| color | Optionnel. Couleur de l'ombre. Valeurs de couleur CSS. | Test |
Détails techniques
| Valeur par défaut : | none |
|---|---|
| Héritabilité : | yes |
| Version : | CSS3 |
| Syntaxe JavaScript : | object.style.textShadow="2px 2px #ff0000" |
Plus d'exemples
- Ombre de texte avec effet de flou
- Cet exemple montre l'effet d'ombre de texte avec un effet de flou.
- Ombre de texte sur le texte blanc
- Cet exemple montre l'effet d'ombre de texte sur le texte blanc.
- Texte avec effet de texte néon
- Cet exemple montre le texte avec un effet de texte néon.
Support du navigateur
Les nombres dans le tableau indiquent la version du navigateur la première à prendre en charge cette propriété.
| Chrome | IE / Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| 4.0 | 10.0 | 3.5 | 4.0 | 9.6 |
- Page précédente text-overflow
- Page suivante text-transform
