Kolom-regel-kleur - CSS-trucs

Inhoudsopgave:

Anonim

De column-rule-colorCSS-eigenschap bepaalt de kleur van een lijn tussen kolommen in een CSS-lay-out met meerdere kolommen.

De accommodatie kan niet alleen handelen! Om de kleur te zien, moeten we de lijn - technisch een "regel" genoemd - tussen kolommen maken. Dat vereist de column-rule-styleeigenschap.

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

Of we kunnen de column-rulesteno-eigenschap gebruiken, die combineert column-rule-color, column-rule-styleen column-rule-widthin een enkele aangifte.

column-rule: 3px solid #f8a100;

Syntaxis

column-rule-colorheeft een enkele kleurwaarde. Dat kan elke geldige CSS-kleur zijn, inclusief hexadecimale, RGB, RGBa, HSL, HSLa en benoemde kleuren. Het accepteert zelfs currentColorals een waarde.

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

Browser-ondersteuning

D.W.Z Rand Firefox Chrome Safari Opera
10+ 12+ 3.5+ 4+ 3.1+ 11.5+
Android Chrome Android Firefox Android-browser iOS Safari Opera Mini
85+ 79+ Nee 3.2+ Alle
Bron: caniuse

Specificatie

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