La propiedad border-inline-style es una propiedad incorporada en CSS que se usa para establecer los valores de propiedad de estilo de borde en línea del bloque lógico individual en un solo lugar en la hoja de estilo. Establece el estilo de borde en línea superior (izquierda) e inferior (derecha) del elemento de borde de definición.
Sintaxis:
border-inline-style: style;
Valores de propiedad:
- estilo: Esta propiedad mantiene el estilo del borde discontinuo, borde, punteado, etc.
Los siguientes ejemplos ilustran la propiedad border-inline-style en el CSS:
Ejemplo 1:
<!DOCTYPE html>
<html>
<head>
<title>CSS | border-inline-style Property</title>
<style>
h1 {
color: green;
}
div {
background-color: yellow;
width: 220px;
height: 40px;
}
.one {
border: 5px solid cyan;
border-inline-style: dashed;
background-color: purple;
}
</style>
</head>
<body>
<center>
<h1>Geeksforgeeks</h1>
<b>CSS | border-inline-style Property</b>
<br><br>
<div class="one">A Computer Science Portal</div>
</center>
</body>
</html>
Producción:
Ejemplo 2:
<!DOCTYPE html>
<html>
<head>
<title>CSS | border-inline-style Property</title>
<style>
h1 {
color: green;
}
div {
background-color: yellow;
width: 220px;
height: 40px;
}
.one {
border: 5px dotted cyan;
border-inline-style: solid;
background-color: purple;
}
</style>
</head>
<body>
<center>
<h1>Geeksforgeeks</h1>
<b>CSS | border-inline-style Property</b>
<br><br>
<div class="one">A Computer Science Portal</div>
</center>
</body>
</html>
Producción:
Navegadores compatibles: los navegadores compatibles con la propiedad border-inline-style se enumeran a continuación:
- Firefox
- Ópera
- Borde
Publicación traducida automáticamente
Artículo escrito por GeeksforGeeks-1 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA