Kolonne-regel-bredde - CSS-triks

Innholdsfortegnelse:

Anonim

Den column-rule-widthCSS eiendom angir tykkelsen av linjen som er trukket mellom søylene ved column-rule-stylei en CSS multi-kolonne layout.

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

En annen måte å gå frem på er å bruke column-rulestenografi-egenskapen, som kombinerer column-rule-width, column-rule-styleog column-rule-color.

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

Syntaks

column-rule-width: thin | medium | thick |
  • Opprinnelig verdi: medium
  • Gjelder: flerkolonnebeholdere
  • Arvet: nei
  • Beregnet verdi: absolutt lengde; 0hvis det column-rule-styleer noneellerhidden
  • Animasjonstype: etter beregnet verditype

Verdier

column-rule-width tar en enkelt navngitt, lengde eller global verdi.

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

Nettleserstøtte

DVS Kant Firefox Chrome Safari Opera
10+ 12+ 3.5+ 4+ 3.1+ 11.5+
Android Chrome Android Firefox Android-nettleser iOS Safari Opera Mini
85+ 79+ Nei 3.2+ Alle
Kilde: caniuse

Spesifikasjon

CSS Multi-column Layout Module Level 1 (Editor's Draft)