CSS border-block-end-color
La proprietà CSS3 border-block-end-color imposta il colore del bordo alla fine del blocco
La proprietà border-block-end-color
definisce il colore del bordo alla fine del blocco logico (tipicamente il bordo inferiore). È particolarmente utile in contesti internazionali o in scritture verticali e RTL, poiché segue la logica di disposizione del contenuto piuttosto che una direzione fisica fissa.
Sintassi
Significato dei valori principali:
-
color: specifica il colore del bordo alla fine del blocco. Può essere espresso in formato esadecimale (
#ff4500
), RGB (rgb(255, 69, 0)
), HSL, o parole chiave comered
,blue
,black
, ecc.
Esempio proprietà: border-block-end-color
Codice Esempio: border-block-end-color

.border-block-end-color-example {
border-block-end-width: 5px; /* Larghezza del bordo inferiore logico */
border-block-end-style: solid; /* Stile del bordo */
border-block-end-color: #00897b; /* Colore verde acqua */
padding: 20px;
background-color: #e0f2f1;
font-size: 20px;
text-align: center;
border-radius: 6px;
}
Contenuto Esempio: border-block-end-color
Esempio di utilizzo di border-block-end-color
In questo esempio, border-block-end-color
imposta il colore del bordo alla fine del blocco:
CSS e HTML per l'elemento con border-block-end-color
:
<style>
.border-block-end-color-example {
border-block-end-width: 5px;
border-block-end-style: solid;
border-block-end-color: #00897b;
padding: 20px;
background-color: #e0f2f1;
font-size: 20px;
text-align: center;
border-radius: 6px;
}
</style>
<div class="border-block-end-color-example">
Bordo logico in basso colorato
</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.