Proprietà CSS text-shadow
Esempio
Ombra di testo di base:
h1
{
text-shadow: 2px 2px #ff0000;
}
Altri esempi "Provalo da solo" di seguito.
Definizione e utilizzo
La text-shadowproprietà aggiunge ombra al testo.
Questa proprietà accetta un elenco di ombre separate da virgole da applicare al testo.
| Valore di default: | nessuno |
|---|---|
| Ereditato: | sì |
| Animabile: | sì. Leggi su animabile |
| Versione: | CSS3 |
| sintassi JavaScript: | oggetto .style.textShadow="2px 5px 5px rosso" |
Supporto browser
I numeri nella tabella specificano la prima versione del browser che supporta completamente la proprietà.
| Property | |||||
|---|---|---|---|---|---|
| text-shadow | 4.0 | 10.0 | 3.5 | 4.0 | 9.6 |
Sintassi CSS
text-shadow: h-shadow v-shadow blur-radius color|none|initial|inherit;
Nota: per aggiungere più di un'ombreggiatura al testo, aggiungi un elenco di ombre separate da virgole.
Valori di proprietà
| Value | Description | Play it |
|---|---|---|
| h-shadow | Required. The position of the horizontal shadow. Negative values are allowed | |
| v-shadow | Required. The position of the vertical shadow. Negative values are allowed | |
| blur-radius | Optional. The blur radius. Default value is 0 | |
| color | Optional. The color of the shadow. Look at CSS Color Values for a complete list of possible color values | |
| none | Default value. No shadow | |
| initial | Sets this property to its default value. Read about initial | |
| inherit | Inherits this property from its parent element. Read about inherit |
Suggerimento: leggi di più sui valori consentiti (unità di lunghezza CSS)
Altri esempi
Esempio
Ombra di testo con effetto sfocato:
h1 {
text-shadow: 2px 2px 8px #FF0000;
}
Esempio
Ombra di testo su un testo bianco:
h1 {
color: white;
text-shadow: 2px 2px 4px #000000;
}
Esempio
Ombra di testo con un bagliore al neon rosso:
h1 {
text-shadow: 0 0 3px #FF0000;
}
Esempio
Ombra di testo con un bagliore al neon rosso e blu:
h1 {
text-shadow: 0 0 3px #FF0000, 0 0 5px #0000FF;
}
Pagine correlate
Tutorial CSS: CSS Text Shadow
Riferimento HTML DOM: proprietà textShadow