Podemos establecer el ancho del borde inferior usando la propiedad CSS border-bottom-width . Podemos dar el tamaño en píxeles y también podemos dar valores predefinidos como grueso, delgado, etc.
Enfoque 1:
- Usaremos CSS en línea dentro de las etiquetas.
- Usaremos la propiedad border-color , border-style para definir el borde claramente.
- Podemos dar el ancho del borde inferior usando la propiedad border-bottom-width .
Ejemplo:
HTML
<!DOCTYPE html> <html> <head> <title>Width Bottom Border CSS</title> </head> <body> <h1 style="border-color : red ; border-style : solid ; border-bottom-width : 100px ;"> GFG FOR INTERVIEW PREPARATIONS AND MUCH MORE</h1> </body> </html>
Producción:
borde-inferior-ancho
Enfoque 2:
- Usamos CSS dentro de la etiqueta de estilo, que también se conoce como CSS interno .
- Podemos dar el ancho del borde inferior usando border-bottom-width en píxeles y valores predefinidos como delgado, grueso, etc.
Ejemplo:
HTML
<!DOCTYPE html>
<html>
<head>
<title>Width Bottom Border CSS</title>
<style>
h1{
border-color:green;
border-style:solid;
border-bottom-width:70px ;
}
h2{
border-color:rgb(224, 238, 23);
border-style:solid;
border-bottom-width:thin ;
}
h3{
border-color:rgb(23, 123, 238);
border-style:solid;
border-bottom-width:thick ;
}
</style>
</head>
<body>
<h1>GFG FOR INTERVIEW PREPARATIONS AND MUCH MORE</h1>
<h2>GFG FOR INTERVIEW PREPARATIONS AND MUCH MORE</h2>
<h3>GFG FOR INTERVIEW PREPARATIONS AND MUCH MORE</h3>
</body>
</html>
Producción:
borde-inferior-ancho grueso
Publicación traducida automáticamente
Artículo escrito por agrajat112 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA