CSS border-left-width
La proprietà CSS border-left-width imposta la larghezza del bordo sinistro
La proprietà border-left-width consente di definire lo spessore del bordo sinistro di un elemento. Può essere utilizzata insieme ad altre proprietà di bordo come border-left-style e border-left-color per un controllo completo dell'aspetto del bordo sinistro.
Sintassi
Significato dei valori principali:
-
length: specifica lo spessore del bordo sinistro in unità di misura come px, em, rem, ecc. Ad esempio,
5px,1em. -
thin: imposta uno spessore del bordo sottile.
-
medium: imposta uno spessore del bordo medio (valore predefinito).
-
thick: imposta uno spessore del bordo spesso.
Esempio proprietà: border-left-width
Codice Esempio: border-left-width
.border-left-width-example {
width: 300px;
height: 200px;
border-left-width: 10px; /* Imposta la larghezza del bordo sinistro a 10px */
border-left-style: solid; /* Bordo sinistro solido */
border-left-color: #50a14f; /* Colore verde per il bordo sinistro */
padding: 20px;
background-color: #ff6347;
color: white;
font-size: 22px;
text-align: center;
border-radius: 10px;
}
Contenuto Esempio: border-left-width
Esempio di utilizzo di border-left-width
In questo esempio, la proprietà border-left-width viene utilizzata per impostare lo spessore del bordo sinistro di un elemento. Affinché il bordo sia visibile, è necessario specificarne anche lo stile e il colore.
CSS e HTML per l'elemento con bordo sinistro personalizzato:
<style>
.border-left-width-example {
width: 300px;
height: 200px;
border-left-width: 10px; /* Imposta la larghezza del bordo sinistro a 10px */
border-left-style: solid; /* Imposta lo stile del bordo come solido */
border-left-color: #50a14f; /* Imposta il colore del bordo sinistro */
padding: 20px;
background-color: #ff6347;
color: white;
font-size: 22px;
text-align: center;
border-radius: 10px;
}
</style>
<div class="border-left-width-example">
Elemento con bordo sinistro personalizzato
</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.118
