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

Результат: