Estilo borderColor Propiedad
Ejemplo
Cambia el color de los cuatro bordes de un elemento <div> a rojo:
document.getElementById("myDiv").style.borderColor = "red";
Más ejemplos de "Pruébelo usted mismo" a continuación.
Definición y uso
La propiedad borderColor establece o devuelve el color del borde de un elemento.
Esta propiedad puede tomar de uno a cuatro valores:
- Un valor, como: p {border-color: red} - los cuatro bordes serán rojos
- Dos valores, como: p {border-color: red transparent} - los bordes superior e inferior serán rojos, los bordes izquierdo y derecho serán transparentes
- Tres valores, como: p {border-color: red green blue}: el borde superior será rojo, los bordes izquierdo y derecho serán verdes, el borde inferior será azul
- Cuatro valores, como: p {border-color: red green blue yellow}: el borde superior será rojo, el borde derecho será verde, el borde inferior será azul, el borde izquierdo será amarillo
Compatibilidad con navegador
Los números de la tabla especifican la primera versión del navegador que es totalmente compatible con la propiedad.
| Property | |||||
|---|---|---|---|---|---|
| borderColor | 1.0 | 4.0 | 1.0 | 1.0 | 3.5 |
Sintaxis
Devuelve la propiedad borderColor:
object.style.borderColor
Establezca la propiedad borderColor:
object.style.borderColor = "color|transparent|initial|inherit"
Valores de propiedad
| Value | Description |
|---|---|
| color | Specifies the color of the border. Look at CSS Color Values for a complete list of possible color values. Default color is the current color of the element |
| transparent | The color of the border is transparent (underlying content will shine through) |
| initial | Sets this property to its default value. Read about initial |
| inherit | Inherits this property from its parent element. Read about inherit |
Detalles técnicos
| Valor por defecto: | color actual |
|---|---|
| Valor de retorno: | Una cadena, que representa el color del borde de un elemento. |
| Versión CSS | CSS1 |
Más ejemplos
Ejemplo
Cambie el color del borde superior e inferior a verde, y el borde izquierdo y derecho a morado, de un elemento <div>:
document.getElementById("myDiv").style.borderColor = "green purple";
Ejemplo
Devuelve el color del borde de un elemento <div>:
alert(document.getElementById("myDiv").style.borderColor);
páginas relacionadas
Tutorial de CSS: Borde CSS
Referencia CSS: propiedad border-color
Referencia HTML DOM: propiedad de borde