Propiedad borderWidth de estilo
Ejemplo
Cambia el ancho de los cuatro bordes de un elemento <div>:
document.getElementById("myDiv").style.borderWidth = "thick";
Definición y uso
La propiedad borderWidth establece o devuelve el ancho del borde de un elemento.
Esta propiedad puede tomar de uno a cuatro valores:
- Un valor, como: p {border-width: thick} - los cuatro bordes serán gruesos
- Dos valores, como: p {border-width: thick thin}: los bordes superior e inferior serán gruesos, los bordes izquierdo y derecho serán delgados
- Tres valores, como: p {border-width: thick thin medium}: el borde superior será grueso, los bordes izquierdo y derecho serán delgados, el borde inferior será mediano
- Cuatro valores, como: p {border-width: thick thin medium 10px}: el borde superior será grueso, el borde derecho será delgado, el borde inferior será mediano, el borde izquierdo será 10px
Compatibilidad con navegador
| Property | |||||
|---|---|---|---|---|---|
| borderWidth | Yes | Yes | Yes | Yes | Yes |
Sintaxis
Devuelve la propiedad borderWidth:
object.style.borderWidth
Establezca la propiedad borderWidth:
object.style.borderWidth = "thin|medium|thick|length|initial|inherit"
Valores de propiedad
| Value | Description |
|---|---|
| thin | Defines a thin border |
| medium | Defines a medium border. This is default |
| thick | Defines a thick border |
| length | The width of the border in length units |
| 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: | medio |
|---|---|
| Valor de retorno: | Una cadena, que representa el ancho del borde de un elemento. |
| Versión CSS | CSS1 |
Más ejemplos
Ejemplo
Cambie el ancho del borde superior e inferior a grueso, y el borde izquierdo y derecho a delgado de un elemento <div>:
document.getElementById("myDiv").style.borderWidth = "thick thin";
Ejemplo
Cambia el ancho de los cuatro bordes de un elemento <div>, usando el valor de longitud :
document.getElementById("myDiv").style.borderWidth = "1px 5px 10px 20px";
Ejemplo
Devuelve el ancho del borde de un elemento <div>:
alert(document.getElementById("myDiv").style.borderWidth);
páginas relacionadas
Tutorial de CSS: Borde CSS
Referencia CSS: propiedad border-width
Referencia HTML DOM: propiedad de borde
❮ Objeto de estilo