CSS border-block-start-style
La proprietà CSS3 border-block-start-style imposta lo stile del bordo all'inizio del blocco
La proprietà border-block-start-style definisce lo stile del bordo logico superiore. È utile in progetti multilingua o responsivi, dove la posizione logica del bordo può variare in base alla direzione di scrittura (ltr, rtl, verticale, ecc.).
Sintassi
Significato dei valori principali:
none: Nessun bordo viene visualizzato.
solid: Bordo a linea continua.
dashed: Bordo tratteggiato.
dotted: Bordo punteggiato.
double: Due linee parallele.
groove / ridge / inset / outset: Effetti 3D, visibili con colore e larghezza appropriati.
Esempio proprietà: border-block-start-style
Codice Esempio: border-block-start-style
.border-block-start-style-example {
border-block-start-width: 4px; /* Spessore del bordo */
border-block-start-style: dotted; /* Stile punteggiato */
border-block-start-color: #264653; /* Colore blu scuro */
padding: 20px;
background-color: #e9ecef;
font-size: 20px;
text-align: center;
border-radius: 6px;
}
Contenuto Esempio: border-block-start-style
Esempio di utilizzo di border-block-start-style
In questo esempio, viene applicato uno stile dotted al bordo all’inizio del blocco logico (sopra):
CSS e HTML per l'elemento con border-block-start-style:
<style>
.border-block-start-style-example {
border-block-start-width: 4px;
border-block-start-style: dotted;
border-block-start-color: #264653;
padding: 20px;
background-color: #e9ecef;
font-size: 20px;
text-align: center;
border-radius: 6px;
}
</style>
<div class="border-block-start-style-example">
Bordo logico superiore punteggiato
</div>
Note:
Le indicazioni dei Browser supportati sono superate grazie alla loro costante evoluzione, si consiglia di verificare la compatibilità dei vari browser eseguendo il test cliccando qui sotto.
Supporto Browser
IP: 216.73.216.108
