Please note, this is a STATIC archive of website developer.mozilla.org from 03 Nov 2016, cach3.com does not collect or store any user information, there is no "phishing" involved.

-moz-border-left-colors

No estándar
This feature is non-standard and is not on a standards track. Do not use it on production sites facing the Web: it will not work for every user. There may also be large incompatibilities between implementations and the behavior may change in the future.

En aplicaciones de Mozilla, como Firefox, la propiedad CSS -moz-border-left-colors aplica una lista de colores al borde derecho.

Cuando un elemento tiene un borde que es mayor de un único pixel CSS, cada línea de pixels usa el siguiente color especificado con esta propiedad, desde fuera hacia adentro. Esto elimina la necesidad de cajas anidadas. Si el borde es mayor que el número colores especificados, la parte restante del borde mantendrá el último color interno especificado.

 

Valor inicialnone
Applies toall elements
Heredableno
Mediavisual
Valor calculadocomo se especifica
Animatableno
Canonical orderel orden único no-ambigüo definido por la gramática formal

 

No se aplica

  1. Si  border-style es dashed o dotted.
  2. A tablas con border-collapse: collapse.

Síntaxis

/* Valor de <color> único */
-moz-border-left-colors: #f0f0f0;

/* Valor de <color> único */
-moz-border-left-colors: #f0f0f0 #a0a0a0 #505050 #000000;

/* Valores globales */
-moz-border-left-colors: inherit;
-moz-border-left-colors: initial;
-moz-border-left-colors: unset;

Valores

Acepta una lista de colores separados por espacios en blanco.

<color>
Especifica el color de una línea de pixels para el borde inferiror. transparent (transparente) es un color válido. Ver  valores de <color> para ver las posibles unidades.
none
Valor por defecto, si se establece no se muestra ningún color  ni se usa border-color.

 

Síntaxis Formal

 

[<color>]* <color> | none

where
<color> = <rgb()> | <rgba()> | <hsl()> | <hsla()> | <hex-color> | <named-color> | currentcolor | <deprecated-system-color>

where
<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

where
<rgb-component> = <integer> | <percentage>
<alpha-value> = <number>
<hue> = <number>

Ejemplo

<div id="example">Ejemplo</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;
}

Especificaciones

Esta propiedad no forma parte de ninguna especificación.

Compatibilidad con los distintos navegadores

Característica Chrome Firefox (Gecko) Internet Explorer Opera Safari
Soporte básico No support 1.0 (1.7 or earlier) No support No support No support
Característica Android Chrome for Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Soporte básico No support No support ? No support No support No support

Ver además

Etiquetas y colaboradores del documento

 Colaboradores en esta página: Sebastianz, pekechis
 Última actualización por: Sebastianz,