Atributo Style borderWidth

Definición y uso

borderWidth La propiedad establece o devuelve el ancho del borde del elemento.

Esta propiedad puede adoptar de uno a cuatro valores:

  • Un valor, por ejemplo: p {border-width: grueso} - todos los cuatro bordes son gruesos
  • Dos valores, por ejemplo: p {border-width: thick thin} - Borde superior e inferior gruesos, bordes derecho e izquierdo finos
  • Tres valores, por ejemplo: p {border-width: thick thin medium} - Borde superior grueso, bordes derecho e izquierdo finos, borde inferior medio
  • Cuatro valores, por ejemplo: p {border-width: thick thin medium 10px} - Borde superior grueso, borde derecho fino, borde inferior medio, borde izquierdo 10px

Vea también:

Tutoriales de CSS:Bordes CSS

Manual de CSS:Atributo border-width

Manual de HTML DOM:Atributo border

Ejemplo

Ejemplo 1

Cambiar el ancho de los cuatro bordes del elemento <div>:

document.getElementById("myDiv").style.borderWidth = "thick";

Pruebe usted mismo

Ejemplo 2

Cambiar el ancho del borde superior e inferior del elemento <div> a grueso y el ancho del borde izquierdo y derecho a fino:

document.getElementById("myDiv").style.borderWidth = "thick thin";

Pruebe usted mismo

Ejemplo 3

Usar valores de longitud para cambiar el ancho de los cuatro bordes del elemento <div>:

document.getElementById("myDiv").style.borderWidth = "1px 5px 10px 20px";

Pruebe usted mismo

Ejemplo 4

Devuelve el ancho del borde del elemento <div>:

alert(document.getElementById("myDiv").style.borderWidth);

Pruebe usted mismo

Sintaxis

Devolver el atributo borderWidth:

object.style.borderWidth

Establecer el atributo borderWidth:

object.style.borderWidth = "thin|medium|thick|length|initial|inherit"
Valor Descripción
thin Define un borde fino.
medium Define un borde medio. Predeterminado.
thick Define un borde grueso.
length Ancho del borde en términos de longitud.
initial Establezca este atributo en su valor predeterminado. Consulte initial
inherit Hereda este atributo del elemento padre. Consulte inherit

Detalles técnicos

Valor predeterminado: medium
Valor devuelto: Cadena que representa el ancho del borde del elemento.
CSS versión: CSS1

Compatibilidad del navegador

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Soporte Soporte Soporte Soporte Soporte