column-rule

Übersicht

In mehrspaltigen Layouts beschreibt die column-rule CSS Eigenschaft eine gerade Linie, welche zwischen jeder Spalte dargestellt wird. Sie ist eine komfortable Kurzform, um das separate Setzen der einzelnen column-rule-* Eigenschaften zu vermeiden: column-rule-width, column-rule-style und column-rule-color.

Initialwert	wie die jeweiligen Kurzschreibweisen: `column-rule-width`: `medium` `column-rule-style`: `none` `column-rule-color`: `currentcolor`
Anwendbar auf	mehrspaltige Elemente
Vererbt	Nein
Medien	visuell
Berechneter Wert	wie die jeweiligen Kurzschreibweisen: `column-rule-color`: berechnete Farbe `column-rule-style`: wie angegeben `column-rule-width`: die absolute Länge; `0` falls `column-rule-style` `none` oder `hidden` ist
Animationstyp	wie die jeweiligen Kurzschreibweisen: `column-rule-color`: Farbe `column-rule-style`: diskret `column-rule-width`: Längenangabe
Kanonische Reihenfolge	nach Grammatik

Syntax

Formale Syntax: <'column-rule-width'> || <'column-rule-style'> || <'column-rule-color'>

Werte

Akzeptiert einen, zwei oder drei Werte in beliebiger Reihenfolge:

<column-rule-width>: Ist eine <length> oder eins der drei Schlüsselwörter thin, medium oder thick. Siehe border-width für Details.
<column-rule-style>: Siehe border-style für mögliche Werte und Details.
<column-rule-color>: Ist ein <color> Wert.

Beispiele

p.foo { column-rule: dotted; }          /* entspricht "medium dotted currentColor" */
p.bar { column-rule: solid blue; }      /* entspricht "medium solid blue" */
p.baz { column-rule: solid 8px; }       /* entspricht "8px solid currentColor" */
p.abc { column-rule: thick inset blue; }

Live Beispiel

padding:0.3em; background:gold; border:groove 2px gold; column-rule: inset 2px gold; column-width:17em;

Spezifikation

Spezifikation	Status	Kommentar
CSS Multi-column Layout Module Die Definition von 'column-rule' in dieser Spezifikation.	Arbeitsentwurf

Browser Kompatibilität

Wir konvertieren die Kompatibilitätsdaten in ein maschinenlesbares JSON Format. Diese Kompatibilitätstabelle liegt noch im alten Format vor, denn die darin enthaltenen Daten wurden noch nicht konvertiert. Finde heraus wie du helfen kannst!

Desktop
Mobile

Merkmal	Chrome	Firefox (Gecko)	Internet Explorer	Opera	Safari (WebKit)
Grundlegende Unterstützung	(Ja)-webkit	3.5 (1.9.1)-moz	10	11.1	3.0 (522)-webkit

Merkmal	Android	Firefox Mobile (Gecko)	IE Phone	Opera Mobile	Safari Mobile
Grundlegende Unterstützung	?	(Ja)	?	?	?