-moz-border-right-colors

In Mozilla-Anwendungen wie Firefox, setzt die -moz-border-top-colors CSS Eigenschaft eine Liste von Farben für den rechten 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.

Sie wird nicht angewendet

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

Syntax

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

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

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

Werte

Akzeptiert eine durch Leerzeichen getrennte Liste von Farbwerten.

<color>

Definiert die Farbe einer Linie von Pixeln des rechten 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>+ | none
wobei 
<color> = <rgb()> | <rgba()> | <hsl()> | <hsla()> | <hex-color> | <named-color> | currentcolor | <deprecated-system-color>
wobei 
<rgb()> = rgb( <percentage>{3} [ / <alpha-value> ]? ) | rgb( <number>{3} [ / <alpha-value> ]? ) | rgb( <percentage>#{3} , <alpha-value>? ) | rgb( <number>#{3} , <alpha-value>? )
<rgba()> = rgba( <percentage>{3} [ / <alpha-value> ]? ) | rgba( <number>{3} [ / <alpha-value> ]? ) | rgba( <percentage>#{3} , <alpha-value>? ) | rgba( <number>#{3} , <alpha-value>? )
<hsl()> = hsl( <hue> <percentage> <percentage> [ / <alpha-value> ]? ) | hsl( <hue>, <percentage>, <percentage>, <alpha-value>? )
<hsla()> = hsla( <hue> <percentage> <percentage> [ / <alpha-value> ]? ) | hsla( <hue>, <percentage>, <percentage>, <alpha-value>? )
wobei 
<alpha-value> = <number> | <percentage>
<hue> = <number> | <angle>

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.

Browser Kompatibilität

Siehe auch

• border-color
• -moz-border-top-colors
• -moz-border-bottom-colors
• -moz-border-left-colors