-moz-border-left-colors

Kein Standard
Diese Funktion entspricht nicht dem Standard und ist nicht Teil der Standardisierung. Diese Funktion darf nicht in Webseiten, die via das Internet zugänglich sind, benutzt werden: Sie wird nicht für alle Nutzer funktionieren. Es kann zu umfangreichen Inkompatibilitäten zwischen verschiedenen Implementierungen kommen und die Funktionsweise oder Eigenschaften könnten in der Zukunft verändert werden.

In Mozilla-Anwendungen wie Firefox, setzt die -moz-border-left-colors CSS Eigenschaft eine Liste von Farben für den linken Rand.

Wenn ein Element einen Rand hat, der größer ist als ein einzelner CSS-Pixel, verwendet jede Zeile von Pixeln die nächste Farbe, die in dieser Eigenschaft angegeben wurde, von außen nach innen. Dies beseitigt die Notwendigkeit von verschachtelten Boxen. Falls der Rand breiter ist als die Anzahl der definierten Farben, wird der verbleibende Teil des Randes in der innersten Farbe gezeichnet.

Initialwert	`none`
Anwendbar auf	alle Elemente
Vererbt	Nein
Medien	visuell
Berechneter Wert	wie angegeben
Animierbar	Nein
Kanonische Reihenfolge	die eindeutige Reihenfolge definiert durch die formale Grammatik

Sie wird nicht angewendet

wenn border-style dashed oder dotted ist.
auf Tabellen mit border-collapse: collapse.

Syntax

/* Einzelner <color> Wert */
-moz-border-left-colors: #f0f0f0;

/* Mehrere <color> Werte */
-moz-border-left-colors: #f0f0f0 #a0a0a0 #505050 #000000;

/* Globale Werte */
-moz-border-left-colors: inherit;
-moz-border-left-colors: initial;
-moz-border-left-colors: unset;

Werte

Akzeptiert eine durch Leerzeichen getrennte Liste von Farbwerten.

<color>: Definiert die Farbe einer Linie von Pixeln des linken Randes. transparent ist gültig. Siehe <color> Werte für mögliche Einheiten.
none: Es werden keine Farben gezeichnet oder border-color verwendet, falls angegeben.

Formale Syntax

[<color>]* <color> | nonewobei 
<color> = <rgb()> | <rgba()> | <hsl()> | <hsla()> | <hex-color> | <named-color> | currentcolor | <deprecated-system-color>
wobei 
<rgb()> = rgb( <rgb-component>#{3} )
<rgba()> = rgba( <rgb-component>#{3} , <alpha-value> )
<hsl()> = hsl( <hue>, <percentage>, <percentage> )
<hsla()> = hsla( <hue>, <percentage>, <percentage>, <alpha-value> )
<named-color> = <ident>
<deprecated-system-color> = ActiveBorder | ActiveCaption | AppWorkspace | Background | ButtonFace | ButtonHighlight | ButtonShadow | ButtonText | CaptionText | GrayText | Highlight | HighlightText | InactiveBorder | InactiveCaption | InactiveCaptionText | InfoBackground | InfoText | Menu | MenuText | Scrollbar | ThreeDDarkShadow | ThreeDFace | ThreeDHighlight | ThreeDLightShadow | ThreeDShadow | Window | WindowFrame | WindowText
wobei 
<rgb-component> = <integer> | <percentage>
<alpha-value> = <number>
<hue> = <number>

Beispiel

<div id="example">Beispiel</div>

#example {
  padding: 20px;
  background-color: gray;
  border: 10px solid black;
  -moz-border-top-colors: #e00 #c30 #c50 #c60 #c70 #c80 #c90 #ca0 #cb0 #cc0;
  -moz-border-right-colors: red #f60 #f80 #f90 #fa0 #fb0 #fc0 #fd0 #fe0 #ff0;
  -moz-border-bottom-colors: red #f60 #f80 #f90 #fa0 #fb0 #fc0 #fd0 #fe0 #ff0;
  -moz-border-left-colors: #e00 #c30 #c50 #c60 #c70 #c80 #c90 #ca0 #cb0 #cc0;
}

Spezifikationen

Diese Eigenschaft ist nicht Teil irgendeiner Spezifikation.

Merkmal	Chrome	Firefox (Gecko)	Internet Explorer	Opera	Safari
Grundlegende Unterstützung	Nicht unterstützt	1.0 (1.7 oder früher)	Nicht unterstützt	Nicht unterstützt	Nicht unterstützt

Merkmal	Android	Chrome for Android	Firefox Mobile (Gecko)	IE Mobile	Opera Mobile	Safari Mobile
Grundlegende Unterstützung	Nicht unterstützt	Nicht unterstützt	?	Nicht unterstützt	Nicht unterstützt	Nicht unterstützt