HTML DOM borderImageWidth प्रॉपर्टी का उपयोग किसी तत्व के लिए बॉर्डर इमेज की चौड़ाई को सेट या प्राप्त करने के लिए किया जाता है।
सिंटैक्स निम्नलिखित है:
borderImageWidth प्रॉपर्टी सेट करना:
object.style.borderImageWidth = "number|%|auto|initial|inherit"
उपरोक्त प्रॉपर्टी निम्नलिखित हैं:
| मान | विवरण |
|---|---|
| length | बॉर्डर चौड़ाई आकार को पिक्सेल में वर्णन करने के लिए। |
| number | संबंधित बॉर्डर चौड़ाई के गुणकों में बॉर्डर चौड़ाई का वर्णन करने के लिए और इसका डिफ़ॉल्ट मान 1 है। |
| % | बॉर्डर इमेज क्षेत्र की चौड़ाई के लिए क्षैतिज और लंबवत ऑफसेट का वर्णन करने के लिए। |
| auto | यह इमेज की चौड़ाई और ऊंचाई के अनुरूप चौड़ाई और ऊंचाई सेट करता है। |
| initial | इस प्रॉपर्टी को डिफ़ॉल्ट मान पर सेट करने के लिए। |
| inherit | मूल तत्व के प्रॉपर्टी मान को विरासत में लेने के लिए। |
आइए borderImageWidth प्रॉपर्टी के लिए एक उदाहरण देखें:
उदाहरण
<!DOCTYPE html> <html> <head> <style> #DIV1 { width: 400px; padding: 25px; border-style: solid; border-color: transparent; border-image-slice: 30; border-image-source: url("https://www.tutorialspoint.com/ethereum/images/ethereum-mini-logo.jpg"); border-image-width: 10px; } </style> <script> function changeBorderWidth(){ document.getElementById("DIV1").style.borderImageWidth="30px"; document.getElementById("Sample").innerHTML="बॉर्डर इमेज की चौड़ाई अब बढ़ गई है"; } </script> </head> <body> <div id="DIV1">HELLO</div> <p>नीचे दिए गए बटन पर क्लिक करके उपरोक्त div के बॉर्डर इमेज की चौड़ाई बढ़ाएं</p> <button onclick="changeBorderWidth()">बॉर्डर चौड़ाई बदलें</button> <p id="Sample"></p> </body> </html>आउटपुट
बॉर्डर चौड़ाई बदलें बटन पर क्लिक करने पर:
