Svojstvo text-decoration-style

Svojstvo text-decoration-style menja tip linije kod teksta: pojedinačna linija, dvostruka, u vidu tačaka, u vidu crtica, talasasta linija.

Svojstvo treba koristiti zajedno sa svojstvima text-decoration-line i text-decoration-color. Ova svojstva proširuju delovanje svojstva text-decoration, jer su napredniji analozi.

Sintaksa

cssselektor {
  text-decoration-style: solid | double | dotted | dashed | wavy;
}

Vrednosti

Podrazumevana vrednost: solid.

Primer . Vrednost wavy

Sada će tekst biti podvučen crvenom talasastom linijom:

html<div id="elem">
  Lorem ipsum dolor sit amet.
</div>

css#elem {
  text-decoration-style: wavy;
  text-decoration-color: red;
  text-decoration-line: underline;
}

Результат:

Primer . Vrednost dotted

Sada će tekst biti podvučen crvenom linijom u vidu tačaka:

html<div id="elem">
  Lorem ipsum dolor sit amet.
</div>

css#elem {
  text-decoration-style: dotted;
  text-decoration-color: red;
  text-decoration-line: underline;
}

Результат:

Primer . Vrednost double

Sada će tekst biti precrtan crvenom dvostrukom linijom:

html<div id="elem">
  Lorem ipsum dolor sit amet.
</div>

css#elem {
  text-decoration-style: double;
  text-decoration-color: red;
  text-decoration-line: line-through;
}

Результат: