HTML DOM Style columnCount प्रॉपर्टी का उपयोग उस कॉलम की संख्या को सेट करने के लिए किया जाता है जिसमें किसी तत्व को विभाजित किया जाना है।
सिंटैक्स निम्नलिखित है:
columnCount प्रॉपर्टी सेट करना:
object.style.columnCount = "number|auto|initial|inherit"
उपरोक्त प्रॉपर्टी निम्नलिखित हैं:
| मान | विवरण |
|---|---|
| Number | उस कॉलम की संख्या सेट करने के लिए जिसमें तत्व की सामग्री को विभाजित किया जाएगा। |
| Auto | कॉलम की संख्या अन्य प्रॉपर्टी द्वारा निर्धारित की जाती है जैसे "column-width"। यह डिफ़ॉल्ट प्रॉपर्टी मान है। |
| Initial | इस प्रॉपर्टी को प्रारंभिक मान पर सेट करने के लिए। |
| Inherit | मूल तत्व के प्रॉपर्टी मान को विरासत में लेने के लिए। |
आइए columnCount प्रॉपर्टी के लिए एक उदाहरण देखें:
उदाहरण
<!DOCTYPE html> <html> <head> <style> div { height: 120px; column-count: 2; border: 2px solid black; background-color: mediumvioletred; } div > div { background-color: yellow; } </style> <script> function changeColumnCount(){ document.getElementsByTagName("div")[0].style.columnCount="4"; document.getElementById("Sample").innerHTML="कॉलम काउंट अब 4 तक बढ़ गया है"; } </script> </head> <body> <div id="DIV1"> <div></div> </div> <p>नीचे दिए गए बटन पर क्लिक करके उपरोक्त div कॉलम काउंट प्रॉपर्टी बदलें</p> <button onclick="changeColumnCount()">कॉलम काउंट बदलें</button> <p id="Sample"></p> </body> </html>आउटपुट
कॉलम काउंट बदलें बटन पर क्लिक करने पर:
