Kolonne-regel-farge - CSS-triks

Innholdsfortegnelse:

Anonim

Den column-rule-colorCSS eiendom bestemmer fargen på en linje mellom kolonnene i en CSS multi-kolonne layout.

Eiendommen kan ikke handle alene! For å se fargen, må vi lage linjen - teknisk kalt en "regel" - mellom kolonnene. Det krever column-rule-styleeiendommen.

.columns ( column-count: 2 600px; column-rule-style: solid; column-rule-color: #f8a100; )

Eller vi kan bruke column-ruleforkortelsesegenskapen, som kombinerer column-rule-color, column-rule-styleog column-rule-widthi en enkelt erklæring.

column-rule: 3px solid #f8a100;

Syntaks

column-rule-colortar en fargeverdi. Det kan være hvilken som helst gyldig CSS-farge, inkludert hex, RGB, RGBa, HSL, HSLa og navngitte farger. Det aksepterer til og med currentColorsom en verdi.

column-rule-color: #f8a100; column-rule-color: hsl(39,100,49); column-rule-color: rgb(250,162,0); column-rule-color: aliceblue; column-rule-color: currentColor;

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)