Kolumn-regel-bredd - CSS-tricks

Innehållsförteckning:

Anonim

Den column-rule-widthCSS egenskapen anger tjockleken av den linje som dras mellan kolumner av column-rule-stylei en CSS flera kolumner layout.

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

Ett annat sätt att gå igenom är att använda column-rulestenografiegenskapen, som kombinerar column-rule-width, column-rule-styleoch column-rule-color.

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

Syntax

column-rule-width: thin | medium | thick |
  • Ursprungligt värde: medium
  • Gäller för: behållare med flera kolumner
  • Ärvt: nej
  • Beräknat värde: absolut längd; 0om det column-rule-styleär noneellerhidden
  • Animationstyp: efter beräknad värdetyp

Värden

column-rule-width tar ett enda namn, längd eller globalt värde.

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

Webbläsarstöd

IE Kant Firefox Krom Safari Opera
10+ 12+ 3,5+ 4+ 3.1+ 11,5+
Android Chrome Android Firefox Android-webbläsare iOS Safari Opera Mini
85+ 79+ Nej 3.2+ Allt
Källa: caniuse

Specifikation

CSS Layoutmodul för flera kolumner Nivå 1 (Editor's Draft)