Кратко
СкопированоСвойство column
отвечает за внешний вид линии между колонками в многоколоночной вёрстке.
Как понять
СкопированоСвойство column
является шорткатом для свойств:
Можно писать значения в любом порядке, разделяя пробелами, браузер сам поймёт, что мы от него хотим. Но общепринятым форматом является вид «ширина → стиль → цвет»: column
→ column
→ column
. Можно не указывать ширину и цвет, но стиль линии указывается обязательно – у column
нет значения по умолчанию и браузер не поймёт, какую линию нужно нарисовать.
Как пишется
СкопированоДля того чтобы задать между колонками красную пунктирную линию шириной 2 px, мы напишем:
p { column-rule: 2px dashed red;}
p { column-rule: 2px dashed red; }
Прослеживается сходство со свойством border
. Действительно, межколоночная линия описывается так же, как и рамка.
Пример
СкопированоВ примере ниже вы можете поменять внешний вид у линии между колонками. По умолчанию заданы такие стили:
.text-wrapper { column-count: 3; column-rule: 3px solid red; column-gap: 25px;}
.text-wrapper { column-count: 3; column-rule: 3px solid red; column-gap: 25px; }