HTML DOM Style wordWrap गुणधर्म

HTML DOM style wordWrap गुणधर्म HTML दस्तावेज़ में लंबे शब्दों को तोड़कर अगली पंक्ति पर लपेटने के लिए लौटाता और संशोधित करता है।

वाक्य रचना (Syntax)

निम्नलिखित वाक्य रचना है:

wordWrap लौटाना

object.style.wordWrap

wordWrap संशोधित करना

object.style.wordWrap = "value"

मान (Values)

यहाँ मान निम्न हो सकते हैं:

मान	व्याख्या
initial	यह इस गुणधर्म के मान को उसके डिफ़ॉल्ट मान पर सेट करता है।
inherit	यह अपने पैरेंट तत्व से इस गुणधर्म का मान विरासत में लेता है।
normal	यह शब्दों को केवल आवश्यकता पड़ने पर तोड़ता है।
break-word	यह आवश्यकता पड़ने पर अटूट शब्दों को तोड़ने की अनुमति देता है।

उदाहरण

आइए HTML DOM style wordWrap गुणधर्म का एक उदाहरण देखें:

<!DOCTYPE html> <html> <head> <style> 
    body { 
        color: #000; 
        background: lightblue; 
        height: 100vh; 
    } 
    p { 
        border: 2px solid #fff; 
        width: 100px; 
    } 
    .btn { 
        background: #db133a; 
        border: none; 
        height: 2rem; 
        border-radius: 2px; 
        width: 40%; 
        display: block; 
        color: #fff; 
        outline: none; 
        cursor: pointer; 
        margin: 1rem 0; 
    } 
</style> </head> <body> 
<h1>DOM Style wordWrap गुणधर्म उदाहरण</h1> 
<p>यह एक पैराग्राफ तत्व है। यह एक veryveryveryverylongword है। यह एक और veryveryverylongword है।</p> 
<button onclick="add()" class="btn">wordWrap सेट करें</button> 
<script> 
    function add() { 
        document.querySelector('p').style.wordWrap = "break-word"; 
    } 
</script> </body> </html>

आउटपुट

यह निम्न आउटपुट उत्पन्न करेगा:

HTML DOM Style wordWrap गुणधर्म

"wordWrap सेट करें" बटन पर क्लिक करके लंबे शब्दों को लपेटने की अनुमति दें:

HTML DOM Style wordWrap गुणधर्म