column-rule-style

Время чтения: меньше 5 мин

Кратко

Секция статьи "Кратко"

Свойство column-rule-style отвечает за стиль линии между колонками в многоколоночной вёрстке.

Как понять

Секция статьи "Как понять"

Стиль межколоночной линии задаётся при помощи ключевых слов. Более подробно можно прочесть в описании border-style, стиль межколоночной линии задаётся так же, как и стиль рамки.

Как пишется

Секция статьи "Как пишется"

Для того, чтобы задать пунктирную межколоночную линию, мы напишем:

        
          
          p {  column-count: 3;  column-rule-style: dashed;}
          p {
  column-count: 3;
  column-rule-style: dashed;
}

        
        
          
        
      

Также column-rule-style — это второе значение в свойстве column-rule.

Пример

Секция статьи "Пример"

В примере ниже вы можете поменять стиль линии между колонками. По умолчанию заданы такие стили:

        
          
          .text-wrapper {  column-count: 3;  column-rule: 5px solid #ffd829;  column-gap: 25px;}
          .text-wrapper {
  column-count: 3;
  column-rule: 5px solid #ffd829;
  column-gap: 25px;
}

        
        
          
        
      
Открыть демо в новой вкладке