თვისება text-decoration-style

თვისება text-decoration-style ცვლის ტექსტის ხაზის ტიპს: ერთჯერადი ხაზი, ორმაგი, წერტილების სახით, ტირეების სახით, ტალღოვანი ხაზი.

თვისება უნდა იქნას გამოყენებული ერთად თვისებებთან text-decoration-line და text-decoration-color. ეს თვისებები აფართოებენ თვისების text-decoration მოქმედებას, როგორც მისი უფრო მოწინავე ანალოგები.

სინტაქსი

cssსელექტორი {
  text-decoration-line: solid | double | dotted | dashed | wavy;
}

მნიშვნელობები

მნიშვნელობა ნაგულისხმევად: solid.

მაგალითი . მნიშვნელობა wavy

ახლა ტექსტი გახდება ხაზგასმული წითელი ტალღოვანი ხაზით:

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

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

Результат:

მაგალითი . მნიშვნელობა dotted

ახლა ტექსტი გახდება ხაზგასმული წითელი წერტილების სახით ხაზით:

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

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

Результат:

მაგალითი . მნიშვნელობა double

ახლა ტექსტი გახდება გადახაზული წითელი ორმაგი ხაზით:

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;
}

Результат: