HTML DOM columnSpan प्रॉपर्टी का उपयोग यह निर्दिष्ट करने के लिए किया जाता है कि कोई तत्व कॉलम में कैसे फैलता है।
सिंटैक्स निम्नलिखित है:
columnSpan प्रॉपर्टी सेट करना:
object.style.columnSpan = "1|all|initial|inherit"
उपरोक्त प्रॉपर्टी मान निम्नलिखित हैं:
| मान | विवरण |
|---|---|
| 1 | यह तत्व को ठीक एक कॉलम में फैलाता है और यह डिफ़ॉल्ट मान है। |
| All | तत्व को सभी कॉलम में फैलना चाहिए। |
| Initial | इस प्रॉपर्टी को प्रारंभिक मान पर सेट करने के लिए। |
| Inherit | मूल तत्व के प्रॉपर्टी मान को विरासत में लेने के लिए। |
आइए columnSpan प्रॉपर्टी के लिए एक उदाहरण देखें:
उदाहरण
<!DOCTYPE html> <html> <head> <style> #DIV1{ column-count: 3; background-color: papayawhip; } #P1{ background-color: lightcyan; font-size: 1.4em; } </style> <script> function changeColumnSpan(){ document.getElementById("P1").style.columnSpan="all"; document.getElementById("Sample").innerHTML="कॉलम स्पैन अब 1 पर सेट है"; } </script> </head> <body> <div id="DIV1"> <p id="P1">यह एक नमूना पैराग्राफ हेडिंग है</p> यह सिर्फ एक div के अंदर कुछ यादृच्छिक टेक्स्ट है। यह जल्द ही बकवास बनने वाला है। adkasfdlajfkfask . टेक्स्ट अब सामान्य हो गया है। </div> <p>नीचे दिए गए बटन पर क्लिक करके उपरोक्त div कॉलम स्पैन प्रॉपर्टी बदलें</p> <button onclick="changeColumnSpan()">कॉलम स्पैन बदलें</button> <p id="Sample"></p> </body> </html>आउटपुट
कॉलम स्पैन बदलें बटन पर क्लिक करने पर:
