text-shadow

Introdotto in Gecko 1.9.1

Sommario

La proprietà CSS text-shadow accetta una lista di effetti di ombreggiatura separata da virgole, che viene applicata al testo e alle  text-decoration dell'elemento.

• Valore iniziale : none
• Si applica a: tutti gli elementi
• Ereditabile : sì
• Percentuali: no
• Media: visual
• Valore riconosciuto : un colore e tre lunghezze

Sintassi

text-shadow: none | [<shadow>,]* <shadow>

  dove <shadow> è:

[ <colore> <lunghezza> <lunghezza> <lunghezza>? | <lunghezza> <lunghezza> <lunghezza>? <colore>? ]

Valori

<colore>

Opzionale, prima o dopo i valori di <lunghezza> . Se il <colore> non è specificato, viene usato un colore predefinito. Gecko/Firefox usa il valore della proprietà color dell'elemento. Gli altri browser potrebbero comportarsi diversamente.

Nota: Specifica un colore per la compatibilità tra browser.

<lunghezza> <lunghezza>

Vedi <length> per le possibili unità di misura.
Questi valori di <lunghezza> stabiliscono la distanza dell'ombreggiatura. Il primo parametro <lunghezza> specifica la distanza orizzontale. Valori negativi spostano l'ombreggiatura a sinistra del testo. Il secondo parametro <lunghezza> specifica la distanza verticale. Valori negativi spostano l'ompreggiatura sopra il testo. Se entrambi i valori sono 0 l'ombreggiatura si sposta dietro al testo (e potrebbe generare un effetto di sfocato se è specificato il terzo parametro <lunghezza>).

<lunghezza>

Opzionale. Il terzo parametro <lunghezza> specifica il raggio dell'effetto sfocato. Se non viene specificato, è 0. Più alto è il valore, più grande è l'effetto sfocato, quindi l'ombreggiatura diventa più estesa e più chiara.

Examples

Esempio 1 Esempio 2 da Bugzilla

  h1 { text-shadow: black 0 0 0.4em; }

  h2 { text-shadow: red 2px 2px 2px, blue 4px 4px 2px, 6px 6px, green 8px 8px; }

Specifiche

Nota: text-shadow era stata definita impropriamente in CSS2 e scartata in CSS2.1. La specifica Text di CSS3 ha migliorato la sintassi.

• CSS 3 Text #text-shadow Bozza, sono stati proposti alcuni cambiamenti.

Compatibilità tra browser

Al momento di scrittura:

• Opera 9.x supporta al massimo 6 ombreggiature, e aderisce al CSS2 per il colore (la prima ombreggiatura specificata è l'ultima).
• Gecko 1.9.1 (Firefox 3.5) teoricamente supporta infinite ombreggiature (ma non provarci!) e aderisce al CSS3 per il colore (la prima ombra specificata è la prima).

Vedere anche

-moz-box-shadow