Ширина-правила-столбца - CSS-хитрости

Содержание:

Anonim

Свойство column-rule-widthCSS устанавливает толщину линии, которая рисуется между столбцами column-rule-styleв многоколоночном макете CSS.

.columns ( columns: 2 600px; column-rule-style: dotted; column-rule-width: 3px; )

Другой способ сделать это - использовать column-ruleсокращенное свойство, которое объединяет column-rule-width, column-rule-styleи column-rule-color.

.columns ( columns: 2 600px; column-rule: dotted 3px #f8a100; )

Синтаксис

column-rule-width: thin | medium | thick | 
  • Первоначальный значение: medium
  • Применимо к: многоколоночным контейнерам
  • Унаследовано: нет
  • Вычисленное значение: абсолютная длина; 0если column-rule-styleесть noneилиhidden
  • Тип анимации: по типу вычисляемого значения

Значения

column-rule-width принимает одно имя, длину или глобальное значение.

/* Named values */ column-rule-width: thin; column-rule-width: medium; column-rule-width: thick; /* Length values */ column-rule-width: 15px; column-rule-width: 1.5rem; /* Global values */ column-rule-width: inherit; column-rule-width: initial; column-rule-width: unset;

Демо

Поддержка браузера

IE Край Fire Fox Хром Сафари Опера
10+ 12+ 3.5+ 4+ 3.1+ 11.5+
Android Chrome Android Firefox Браузер Android iOS Safari опера мини
85+ 79+ Нет 3.2+ Все
Источник: caniuse

Технические характеристики

CSS-модуль с несколькими столбцами, уровень 1 (черновик редактора)