column-rule प्रॉपर्टी

column-rule प्रॉपर्टी मल्टी-कॉलम टेक्स्ट में कॉलम के बीच की बॉर्डर सेट करती है। यह स्वीकार किए गए मानों में border प्रॉपर्टी के समान है।

उदाहरण . solid प्रकार

इस उदाहरण में, टेक्स्ट 3 कॉलम में विभाजित होगा जिनके बीच 1px मोटी ठोस रेखा के रूप में बॉर्डर होगी (कॉलम के बीच की दूरी स्वचालित रूप से बनेगी, क्योंकि column-gap को normal मान पर सेट किया गया है):

html<div id="elem">
  some long text
</div>

css#elem {
  column-rule: 1px solid black;
  column-count: 3;
  column-gap: normal;
  text-align: justify;
}

Результат:

उदाहरण . column-gap का प्रभाव

इस उदाहरण में, टेक्स्ट 3 कॉलम में विभाजित होगा जिनके बीच 50px का गैप होगा। बॉर्डर गैप के बीच में से गुजरेगी (बॉर्डर के दाएं और बाएं 25px होगा):

html<div id="elem">
  some long text
</div>

css#elem {
  column-rule: 1px solid black;
  column-count: 3;
  column-gap: 50px;
  text-align: justify;
}

Результат:

यह भी देखें