Coloană-regulă-lățime - CSS-Tricks

Cuprins:

Anonim

Proprietatea column-rule-widthCSS stabilește grosimea liniei care este trasată între coloane column-rule-styleîntr-un aspect CSS cu mai multe coloane.

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

O altă modalitate de a face acest lucru este utilizarea column-ruleproprietății de stenografie, care combină column-rule-width, column-rule-styleși column-rule-color.

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

Sintaxă

column-rule-width: thin | medium | thick |
  • Valoarea initiala: medium
  • Se aplică: containerelor cu mai multe coloane
  • Moștenit: nu
  • Valoare calculată: lungime absolută; 0dacă column-rule-styleeste nonesauhidden
  • Tipul animației: după tipul valorii calculate

Valori

column-rule-width ia o singură valoare numită, lungime sau globală.

/* 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;

Demo

Suport pentru browser

IE Margine Firefox Crom Safari Operă
Peste 10 ani 12+ 3.5+ 4+ 3.1+ 11.5+
Android Chrome Android Firefox Browser Android Safari iOS Opera mini
Peste 85 de ani Peste 79 de ani Nu 3.2+ Toate
Sursa: caniuse

Specificație

CSS Multi-column Layout Module Level 1 (Proiect editor)