border-color
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since julio de 2015.
Resumen
la propiedad border-color es un atajo para definir el color de los cuatro bordes de un elemento.
Valor inicial: elcolordel elemento en sí- Se aplica a: todos los elementos
Herencia: no- Percentages: N/A
- Medio:
visual Valor calculada: el valor delcolorpor defecto, o lo que se especificó.
Sintaxis
border-color: [ <color> || transparent ]{1,4} | inherit
Valores
- <color>
-
el color se puede especificar con un valor RGB hexa-decimal o regular, o con el nombre predefinido de ese color.
- transparent
-
el borde no aparece pero ocupa el sitio definido.
Se pueden pasar hasta cuatro valores;
Con un color, los cuatro lados tendrán el mismo. Con dos colores, los lados de arriba y abajo utilizan el primer valor y los izquierda y derecha el segundo. Con tres colores, el primero para arriba, el segundo para izquierda y derecha y el tercero para abajo. Con cuatro colores, el primero para arriba, el segundo para la derecha, el tercero para abajo y el cuarto para la izquierda.
Ejemplos
element {
border-width: 1px;
border-style: solid;
border-color: black;
}
Notas
Para poder ver el/los bordes también hay que definir el ancho con un valor positivo y el estilo con algo visible. (diferente de none o hidden)
Especificaciones
| Specification |
|---|
| CSS Logical Properties and Values Level 1 # logical-shorthand-keyword |
| CSS Backgrounds and Borders Module Level 3 # border-color |
Compatibilidad con navegadores
Loading…
Extensiones Mozilla
La siguientes extensiones definen los múltiples colores de los respectivos bordes en los navegadores Gecko.