Omadus text-shadow

Omadus text-shadow määrab teksti varju. Väärtusena võtab omadus vastu 4 parameetrit, loetletud tühikuga eraldatuna, või võtmesõna none, mis keelab varju täielikult (see on vaikeväärtus).

Süntaks

cssvalija {
  text-shadow: nihe_x_suunas nihe_y_suunas hägustus värv;
}
cssvalija {
  text-shadow: none;
}

Parameetrid

Parameeter Kirjeldus
nihe x suunas Määrab varju nihke X-telje suunas.
Positiivne väärtus nihutab paremale, negatiivne - vasakule.
nihe y suunas Määrab varju nihke Y-telje suunas.
Positiivne väärtus nihutab alla, negatiivne - üles.
hägustus Määrab varju hägustuse.
Mida suurem on väärtus, seda hägusem on vari.
Valikuline parameeter. Kui seda ei määrata, on vari terav.
värv Määrab varju värvi mis tahes värviühikutes.
Valikuline parameeter. Kui seda ei määrata, on varju värv sama kui teksti värv.

Nihked telgede suunas ja hägustus määratakse mis tahes mõõtühikutes, välja arvatud protsentides.

Näide

Nihutame varju alla ja vasakule ning lisame väikese hägustuse:

html<div id="elem">
  Lorem ipsum dolor sit amet.
</div>
css#elem {
  text-shadow: 5px 5px 3px black;
}

Результат:

Näide . Terav vari

Teeme nüüd varju punaseks, nihutame selle alla ja vasakule, kuid eemaldame hägustuse - vari jääb teravaks:

html<div id="elem">
  Lorem ipsum dolor sit amet.
</div>
css#elem {
  text-shadow: 10px 10px red;
}

Результат:

Näide . Ühtlane vari

Praegu pole vari nihutatud, kuid sellele on lisatud hägustus:

html<div id="elem">
  Lorem ipsum dolor sit amet.
</div>
css#elem {
  text-shadow: 0px 0px 3px black;
}

Результат:

Vaata ka

  • omadus box-shadow,
    mis määrab konteineri varju