HTML DOM Style borderRight प्रॉपर्टी

HTML DOM borderRight प्रॉपर्टी का उपयोग किसी तत्व के लिए दाएं बॉर्डर प्रॉपर्टी को प्राप्त या सेट करने के लिए एक शॉर्टहैंड के रूप में किया जाता है। borderRight प्रॉपर्टी में border-right-width, border-right-style, border-right-color शामिल हैं।

सिंटैक्स निम्नलिखित है:

borderRight प्रॉपर्टी सेट करना:

object.style.borderRight = "width style color|initial|inherit"

उपरोक्त प्रॉपर्टी निम्नलिखित हैं:

आइए borderRight प्रॉपर्टी के लिए एक उदाहरण देखें:

उदाहरण

<!DOCTYPE html> <html> <head> <style>    #P1 {       border-right: 4px solid magenta;       font-size: 1.5rem;    } </style> <script>    function changeBorderRight(){       document.getElementById("P1").style.borderRight="9px dashed red";       document.getElementById("Sample").innerHTML="पैराग्राफ तत्व के लिए दाएं बॉर्डर अब बदल गया है";    } </script> </head> <body> <p id="P1">यह पैराग्राफ के अंदर कुछ नमूना टेक्स्ट है। यह इस नमूना टेक्स्ट की एक और पंक्ति है</p> <p>नीचे दिए गए बटन पर क्लिक करके उपरोक्त पैराग्राफ के दाएं बॉर्डर प्रॉपर्टी बदलें</p> <button onclick="changeBorderRight()">दाएं बॉर्डर बदलें</button> <p id="Sample"></p> </body> </html>

आउटपुट

दाएं बॉर्डर बदलें बटन पर क्लिक करने पर:

उपरोक्त उदाहरण में:

हमने पहले "P1" आईडी के साथ एक पैराग्राफ बनाया है जिसमें उसके अंदर कुछ टेक्स्ट है और एक संबंधित CSS शैली लागू है।

#P1 {    border-right: 4px solid magenta;    font-size: 1.5rem; } <p id="P1">यह पैराग्राफ के अंदर कुछ नमूना टेक्स्ट है। यह इस नमूना टेक्स्ट की एक और पंक्ति है</p>

हमने फिर एक बटन "दाएं बॉर्डर बदलें" बनाया जो उपयोगकर्ता द्वारा क्लिक किए जाने पर changeBorderRight() फ़ंक्शन को निष्पादित करेगा।

pre class="result notranslate"> <button onclick="changeBorderRight()">दाएं बॉर्डर बदलें</button>

changeBorderRight() फ़ंक्शन getElementById() मेथड का उपयोग करके "P1" आईडी वाले पैराग्राफ तत्व के borderRight स्टाइल प्रॉपर्टी को प्राप्त करता है और इसके प्रॉपर्टी मान को '9px dashed red' में बदल देता है। इस परिवर्तन को दर्शाने वाला एक संदेश फिर "Sample" आईडी वाले पैराग्राफ में इसके innerHTML प्रॉपर्टी का उपयोग करके प्रदर्शित किया जाता है।

function changeBorderRight(){    document.getElementById("P1").style.borderRight="9px dashed red";    document.getElementById("Sample").innerHTML="पैराग्राफ तत्व के लिए दाएं बॉर्डर अब बदल गया है"; }