Kolonnas noteikums - CSS-triki

Lai padarītu kolonnas atšķirīgas, starp katru kolonnu varat pievienot vertikālu līniju. Līnija atrodas kolonnas atstarpes centrā. Ja jūs kādreiz esat veidojis stilu border, tad esat gatavs veidot column-rule.

.container ( -webkit-columns: 2 400px; -moz-columns: 2 400px; columns: 2 400px; -webkit-column-rule: 1px solid black; -moz-column-rule: 1px solid black; column-rule: 1px solid black; )

Īpašums ir saīsinājums column-rule-width, column-rule-styleun column-rule-color, kas ir tāds pats modelis kā borderun pieņem tās pašas vērtības.

-webkit-column-rule-width: 1px; -moz-column-rule-width: 1px; column-rule-width: 1px; -webkit-column-rule-style: solid; -moz-column-rule-style: solid; column-rule-style: solid; -webkit-column-rule-color: black; -moz-column-rule-color: black; column-rule-color: black;

column-rule-widthvar būt līdzīgs garumam 3pxvai atslēgvārda vērtībai thin.

column-rule-stylevar būt jebkura no border-style, piemēram, vērtībām solid, dottedun dashed.

column-rule-color var būt jebkura krāsu vērtība.

Atšķirībā no tā column-gap, column-ruleneaizņem vietu. Ja tas column-rule-widthir biezāks nekā column-gaptad, noteikums tiks paplašināts zem kolonnām.

Vertikālā kārtula pastāvēs tikai starp kolonnām, kurās ir saturs.