Eienskap text-shadow
Die eienskap text-shadow stel 'n skaduwee vir teks.
As waarde neem die eienskap 4
parameters aan, geskei deur spasies, of
die sleutelwoord none, wat die skaduwee heeltemal
kanselleer (dit is die standaardwaarde).
Sintaksis
selekteerder {
text-shadow: verskuif_op_x verskuif_op_y vervaaging kleur;
}
selekteerder {
text-shadow: none;
}
Parameters
| Parameter | Beskrywing |
|---|---|
| verskuif op x |
Stel die skaduweeverskuiwing op die X-as.
'n Positiewe waarde skuif na regs, 'n negatiewe waarde - na links. |
| verskuif op y |
Stel die skaduweeverskuiwing op die Y-as.
'n Positiewe waarde skuif afwaarts, 'n negatiewe waarde - opwaarts. |
| vervaaging |
Stel die skaduweevervaaging.
Hoe groter die waarde - hoe meer vervaag die skaduwee sal wees. Opsionele parameter. Indien nie gespesifiseer nie - sal die skaduwee skerp wees. |
| kleur |
Stel die skaduweekleur in enige eenhede vir kleur.
Opsionele parameter. Indien nie gespesifiseer nie - val die skaduweekleur saam met die tekskleur. |
Verskuiwings op die asse en vervaaging word gespesifiseer in enige eenhede vir groottes, behalwe persentasies.
Voorbeeld
Kom ons skuif die skaduwee af en links en voeg 'n bietjie vervaaging by:
<div id="elem">
Lorem ipsum dolor sit amet.
</div>
#elem {
text-shadow: 5px 5px 3px black;
}
:
Voorbeeld . Skerp skaduwee
Laat ons nou die skaduwee rooi maak, dit af en links skuif, maar die vervaaging verwyder - die skaduwee sal skerp wees:
<div id="elem">
Lorem ipsum dolor sit amet.
</div>
#elem {
text-shadow: 10px 10px red;
}
:
Voorbeeld . Eenvormige skaduwee
Nou is die skaduwee nie geskuif nie, maar vervaaging is bygevoeg:
<div id="elem">
Lorem ipsum dolor sit amet.
</div>
#elem {
text-shadow: 0px 0px 3px black;
}
:
Sien ook
-
die eienskap
box-shadow,
wat 'n skaduwee vir 'n houer stel