Egenskapen text-shadow
Egenskapen text-shadow setter skygge på tekst.
Som verdi tar egenskapen 4
parametere, opplistet med mellomrom, eller
nøkkelordet none, som fjerner skyggen
helt (dette er standardverdien).
Syntaks
selector {
text-shadow: forskyvning_x forskyvning_y uskarphet farge;
}
selector {
text-shadow: none;
}
Parametere
| Parameter | Beskrivelse |
|---|---|
| forskyvning x |
Setter forskyvning av skyggen langs X-aksen.
Positiv verdi forskyver til høyre, negativ - til venstre. |
| forskyvning y |
Setter forskyvning av skyggen langs Y-aksen.
Positiv verdi forskyver nedover, negativ - oppover. |
| uskarphet |
Setter uskarpheten (blur) på skyggen.
Jo høyere verdi - jo mer uskarp blir skyggen. Valgfri parameter. Hvis ikke satt - vil skyggen være skarp. |
| farge |
Setter fargen på skyggen i alle enheter for farge.
Valgfri parameter. Hvis ikke satt - vil skyggen ha samme farge som teksten. |
Forskyvninger langs aksene og uskarphet settes i alle enheter for størrelser, unntatt prosent.
Eksempel
La oss forskyve skyggen nedover og til venstre og legge til litt uskarphet:
<div id="elem">
Lorem ipsum dolor sit amet.
</div>
#elem {
text-shadow: 5px 5px 3px black;
}
:
Eksempel . Skarp skygge
La oss nå gjøre skyggen rød, forskyve den nedover og til venstre, men fjerne uskarpheten - skyggen vil være skarp:
<div id="elem">
Lorem ipsum dolor sit amet.
</div>
#elem {
text-shadow: 10px 10px red;
}
:
Eksempel . Uniform skygge
Nå er skyggen ikke forskyvet, men den har uskarphet lagt til:
<div id="elem">
Lorem ipsum dolor sit amet.
</div>
#elem {
text-shadow: 0px 0px 3px black;
}
:
Se også
-
egenskapen
box-shadow,
som setter skygge på en container