1La propiedad CSS border-left-style se usa para establecer el estilo del borde izquierdo de un elemento.
Valor por defecto
- ninguna
Sintaxis:
border-left-style: none| hidden| dotted| dashed| solid| double | groove| ridge| inset| outset| initial| inherit;
Valor de las propiedades:
| Valor | Descripción |
|---|---|
| ninguna | No establece ningún borde izquierdo. |
| oculto | No establece ningún borde, excepto la resolución de conflictos de bordes para los elementos de la tabla. |
| punteado | Establece un borde izquierdo punteado. |
| punteado | Establece un borde izquierdo discontinuo. |
| sólido | Establece un borde izquierdo sólido. |
| doble | Establece un borde doble. |
| ranura | Establece un borde izquierdo ranurado en 3D. |
| cresta | Establece un borde izquierdo con surcos 3D. |
| recuadro | Establece un borde izquierdo insertado en 3D. |
| comienzo | Establece un borde izquierdo inicial 3D. |
| inicial | Establece la propiedad de estilo de borde izquierdo en su valor predeterminado. |
| heredar | Hereda los valores de propiedad de su elemento principal. |
Valor devuelto: Devuelve el estilo del borde izquierdo de un elemento.
Ejemplo-1: Mostrando el borde izquierdo punteado.
html
<!DOCTYPE html>
<html>
<head>
<style>
h1 {
border-left-style: dotted;
}
div {
border-style: solid;
border-left-style: dotted;
}
</style>
</head>
<body>
<h1>Geeks for Geeks</h1>
<div>
<h3>Dotted Left Border</h3></div>
</body>
</html>
Producción:
Ejemplo-2: Mostrar borde izquierdo doble
html
<!DOCTYPE html>
<html>
<head>
<style>
h1 {
border-left-style: double;
}
div {
border-style: solid;
border-left-style: double;
}
</style>
</head>
<body>
<h1>Geeks for Geeks</h1>
<div>
<h3>Double Left Border</h3></div>
</body>
</html>
Producción:
Ejemplo-3: Mostrar borde izquierdo sólido
html
<!DOCTYPE html>
<html>
<head>
<style>
h1 {
border-left-style: solid;
}
div {
border-style: solid;
border-left-style: solid;
}
</style>
</head>
<body>
<h1>Geeks for Geeks</h1>
<div>
<h3>Solid Left Border</h3></div>
</body>
</html>
Producción:
Navegadores compatibles: los navegadores compatibles con la propiedad de estilo de borde izquierdo CSS se enumeran a continuación:
- Google Chrome 1.0
- Borde 12
- Firefox 1
- Internet Explorer 5.5
- Ópera 9.2
- Safari 1.0
Publicación traducida automáticamente
Artículo escrito por riarawal99 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA