Колона-правило-ширина - 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 Ръб, край Firefox Chrome Сафари Опера
10+ 12+ 3,5+ 4+ 3.1+ 11,5+
Android Chrome Android Firefox Браузър за Android iOS Safari опера мини
85+ 79+ Не 3.2+ всичко
Източник: caniuse

Спецификация

Модул за оформление на няколко колони CSS Ниво 1 (Чернова на редактора)