HTML DOM स्टाइल textDecorationLine प्रॉपर्टी एक HTML दस्तावेज़ में किसी तत्व के टेक्स्ट को सजाने वाली लाइन के प्रकार को लौटाती है और संशोधित करती है।
सिंटैक्स
निम्नलिखित वाक्य रचना है -
-
रिटर्निंग टेक्स्टडेकोरेशनलाइन
object.style.textDecorationLine
-
टेक्स्ट डेकोरेशन लाइन को संशोधित करना
object.style.textDecorationLine = “value”
मान
यहाँ, मान हो सकता है -
| मान | <वें शैली ="चौड़ाई:85.3741%; पाठ-संरेखण:केंद्र;">स्पष्टीकरण|
|---|---|
| उत्तराधिकारी | यह इस गुण मान को इसके मूल तत्व से प्राप्त करता है। |
| आरंभिक | इसने इस गुण मान को उसके डिफ़ॉल्ट मान पर सेट किया। |
| कोई नहीं | यह केवल सामान्य टेक्स्ट का प्रतिनिधित्व करता है जिसका अर्थ है बिना किसी लाइन के टेक्स्ट। |
| रेखांकित करें | यह टेक्स्ट के नीचे एक लाइन सेट करता है। |
| ओवरलाइन | यह टेक्स्ट के ऊपर एक लाइन सेट करता है। |
| लाइन-थ्रू | यह टेक्स्ट के माध्यम से एक लाइन सेट करता है। |
उदाहरण
आइए स्टाइल टेक्स्टडेकोरेशनलाइन प्रॉपर्टी का एक उदाहरण देखें -
<!DOCTYPE html>
<html>
<head>
<style>
body {
color: #000;
background: lightblue;
height: 100vh;
}
p {
margin: 1.5rem auto;
text-decoration-line: line-through;
}
.btn {
background: #db133a;
border: none;
height: 2rem;
border-radius: 2px;
width: 40%;
display: block;
color: #fff;
outline: none;
cursor: pointer;
}
</style>
</head>
<body>
<h1>DOM Style textDecorationLine Property Example</h1>
<p>This is paragraph 1 with some dummy text. This is paragraph 1 with some dummy text.</p>
<button onclick="add()" class="btn">Change textDecorationLine</button>
<script>
function add() {
document.querySelector('p').style.textDecorationLine = "underline";
}
</script>
</body>
</html> आउटपुट
यह निम्नलिखित आउटपुट देगा -
“टेक्स्टडेकोरेशन लाइन बदलें . पर क्लिक करें पैराग्राफ टेक्स्ट को सजाने के लिए उपयोग की जाने वाली लाइन के प्रकार को बदलने के लिए बटन।
