Хосияти text-decoration-style

Хосияти text-decoration-style навъи хати матнро иваз мекунад: хати ягона, дукарата, ба сурати нуқтаҳо, ба сурати хатикаҳо, хати мавҷдор.

Ин хосият бояд ҳамроҳ бо хосиятҳои text-decoration-line ва text-decoration-color истифода шавад. Ин хосиятҳо амали хосияти text-decoration-ро васеъ карда, ба унвони аналогҳои пешрафтатар мебошанд.

Синтаксис

cssинтихобкунанда {
  text-decoration-line: solid | double | dotted | dashed | wavy;
}

Қиматҳо

Қимат	Тавсиф
`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;
}

Результат: