CSS border-color
La proprietà CSS border-color definisce il colore del bordo
La proprietà border-color
consente di definire il colore del bordo di un elemento. È possibile specificare un colore in vari formati, come nome del colore (ad esempio, red
), valori esadecimali (ad esempio, #ff6347
), o valori RGB (ad esempio, rgb(255, 99, 71)
).
Sintassi
Significato dei valori principali:
-
color: qualsiasi valore di colore valido in CSS, come
red
,#ff6347
,rgb(255, 99, 71)
, ecc.
Esempio proprietà: border-color
Codice Esempio: border-color

.border-color-example {
border-width: 5px;
border-style: solid;
border-color: #50a14f; /* Impostiamo il colore del bordo */
padding: 20px;
background-color: #ff6347;
color: white;
font-size: 22px;
text-align: center;
border-radius: 10px;
}
Contenuto Esempio: border-color
Esempio di utilizzo di border-color
In questo esempio, la proprietà border-color
viene utilizzata per definire il colore del bordo di un elemento:
CSS e HTML per l'elemento con bordo colorato:
<style>
.border-color-example {
width: 300px;
height: 200px;
border-width: 10px;
border-style: solid;
border-color: #50a14f; /* Impostiamo il colore verde del bordo */
padding: 20px;
background-color: #ff6347;
color: white;
font-size: 22px;
text-align: center;
border-radius: 10px;
box-sizing: border-box;
}
</style>
<div class="border-color-example">
Bordo 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.