La propiedad de estilo borderBottomWidth en HTML DOM se usa para establecer o devolver el ancho del borde inferior de un elemento.
Sintaxis:
- Se utiliza para devolver el ancho del borde inferior.
object.style.borderBottomWidth
- Se utiliza para establecer el ancho del borde inferior.
border-bottom-width: "medium|thin|thick|length|initial|inherit";
Valor devuelto: Devuelve el ancho del borde inferior del elemento seleccionado.
Valores de propiedad:
- medium: Establece el borde inferior de tamaño mediano. Es el valor predeterminado.
- delgada: Establece el borde delgado de la parte inferior.
- grueso: Establece el borde inferior grueso.
- length: Establece el ancho del borde. No toma valor negativo.
- initial: establece la propiedad borderBottomWidth en su valor predeterminado.
- heredar: Esto se usa para heredar de su elemento padre.
Ejemplo 1: este ejemplo utiliza un valor grueso de la propiedad borderBottomWidth.
<!DOCTYPE html>
<html>
<head>
<title>
HTML | DOM Style borderBottomWidth Property
</title>
<style>
div {
color: green;
border: 1px solid green;
text-align: center;
}
</style>
</head>
<body>
<div id="main">
<h1>GeeksforGeeks.!</h1>
</div>
<br>
<input type="button" value="Click Me.!" onclick="geeks()" />
<script>
function geeks() {
document.getElementById("main").style.borderBottomWidth
= "thick";
}
</script>
</body>
</html>
Salida:
Antes de hacer clic en el botón: 
Después de hacer clic en el botón:
Ejemplo 2: este ejemplo utiliza un valor reducido de la propiedad borderBottomWidth.
<!DOCTYPE html>
<html>
<head>
<title>
HTML | DOM Style borderBottomWidth Property
</title>
<style>
div {
color: green;
border: 8px solid green;
text-align: center;
}
</style>
</head>
<body>
<div id = "main">
<h1>GeeksforGeeks.!</h1>
</div>
<br>
<input type = "button" value = "Click Me.!"
onclick = "geeks()" />
<script>
function geeks() {
document.getElementById("main").style.borderBottomWidth
= "thin";
}
</script>
</body>
</html>
Salida:
Antes de hacer clic en el botón: 
Después de hacer clic en el botón:
Navegadores compatibles: los navegadores compatibles con la propiedad Style borderBottomWidth se enumeran a continuación:
- Google Chrome 1.0
- Internet Explorer 4.0
- Firefox 1.0
- Ópera 3.5
- Safari 1.0
Publicación traducida automáticamente
Artículo escrito por kundankumarjha y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA