Ominaisuus text-decoration-style
Ominaisuus text-decoration-style muuttaa
tekstin viivatyyppiä: yksittäinen viiva, kaksoisviiva,
pisteviiva, katkoviiva, aaltoviiva.
Ominaisuutta tulisi käyttää yhdessä
ominaisuuksien text-decoration-line
ja text-decoration-color kanssa.
Nämä ominaisuudet laajentavat
text-decoration-ominaisuuden
toimintoa, ollen kehittyneempiä vastineita.
Syntaksi
valitsija {
text-decoration-line: solid | double | dotted | dashed | wavy;
}
Arvot
| Arvo | Kuvaus |
|---|---|
solid |
Yhtenäinen viiva. |
double |
Kaksoisviiva. |
dotted |
Pisteviiva. |
dashed |
Katkoviiva. |
wavy |
Aaltoviiva. |
Oletusarvo: solid.
Esimerkki . Arvo wavy
Nyt tekstistä tulee alleviivattu punaisella aaltoviivalla:
<div id="elem">
Lorem ipsum dolor sit amet.
</div>
#elem {
text-decoration-style: wavy;
text-decoration-color: red;
text-decoration-line: underline;
}
:
Esimerkki . Arvo dotted
Nyt tekstistä tulee alleviivattu punaisella pisteviivalla:
<div id="elem">
Lorem ipsum dolor sit amet.
</div>
#elem {
text-decoration-style: dotted;
text-decoration-color: red;
text-decoration-line: underline;
}
:
Esimerkki . Arvo double
Nyt teksti yliviivataan punaisella kaksoisviivalla:
<div id="elem">
Lorem ipsum dolor sit amet.
</div>
#elem {
text-decoration-style: double;
text-decoration-color: red;
text-decoration-line: line-through;
}
:
