HTML DOM columnRuleColor प्रॉपर्टी का उपयोग कॉलम के बीच नियम के रंग को सेट या प्राप्त करने के लिए किया जाता है।
सिंटैक्स निम्नलिखित है:
columnRuleColor प्रॉपर्टी सेट करना:
object.style.columnRuleColor = "color|initial|inherit"
यहां, रंग नियम के रंग को निर्दिष्ट करता है। Initial मान को डिफ़ॉल्ट मान पर सेट करता है और inherit इसे मूल तत्व के प्रॉपर्टी मान पर सेट करता है।
आइए columnRuleColor प्रॉपर्टी के लिए एक उदाहरण देखें:
उदाहरण
<!DOCTYPE html> <html> <head> <style> #DIV1{ padding: 5px; column-count: 5; column-rule-width: 9px; column-rule-style: solid; column-rule-color: lightcoral; } </style> <script> function changeColumnRuleColor(){ document.getElementById("DIV1").style.columnRuleColor="blue"; document.getElementById("Sample").innerHTML="कॉलम नियम का रंग अब बदल गया है"; } </script> </head> <body> <div id="DIV1"> <img src="https://www.tutorialspoint.com/images/Swift.png"><br/> <img src="https://www.tutorialspoint.com/images/xamarian.png"><br/> <img src="https://www.tutorialspoint.com/images/pl-sql.png"><br/> <img src="https://www.tutorialspoint.com/images/asp-net.png"><br/> <img src="https://www.tutorialspoint.com/images/powerbi.png"><br/> <img src="https://www.tutorialspoint.com/images/Tableau.png"><br/> <img src="https://www.tutorialspoint.com/images/Big-Data-Analytics.png"><br/> <img src="https://www.tutorialspoint.com/images/microsoftproject.png"> <img src="https://www.tutorialspoint.com/images/QlikView.png"><br/> <img src="https://www.tutorialspoint.com/images/hadoop.png"> </div> <p>नीचे दिए गए बटन पर क्लिक करके उपरोक्त div कॉलम नियम रंग बदलें</p> <button onclick="changeColumnRuleColor()">कॉलम नियम रंग बदलें</button> <p id="Sample"></p> </body> </html>आउटपुट
कॉलम नियम रंग बदलें बटन पर क्लिक करने पर:
