CSS outline-width
La proprietà CSS outline-width imposta lo spessore del contorno (CSS3)
La proprietà outline-width
consente di controllare lo spessore del contorno attorno a un elemento. Può essere specificata con valori numerici (px
, em
, ecc.) o parole chiave (thin
, medium
, thick
). Affinché il contorno sia visibile, è necessario specificare anche outline-style
.
Sintassi
Significato dei valori principali:
length: specifica uno spessore personalizzato, ad esempio
2px
,0.5em
,4pt
, ecc.thin: uno spessore sottile predefinito dal browser.
medium: valore predefinito, di spessore medio.
thick: uno spessore più marcato.
Esempio proprietà: outline-width
Codice Esempio: outline-width

.outline-width-example {
width: 300px;
height: 150px;
outline-width: 6px;
outline-style: solid;
outline-color: #4caf50;
padding: 20px;
background-color: #ffffff;
font-size: 18px;
text-align: center;
border-radius: 6px;
color: #333;
}
Contenuto Esempio: outline-width
Esempio di utilizzo di outline-width
In questo esempio, la proprietà outline-width
viene utilizzata per impostare uno spessore personalizzato al contorno:
CSS e HTML per il contorno con spessore personalizzato:
<style>
.outline-width-example {
width: 300px;
height: 150px;
outline-width: 6px; /* Spessore del contorno */
outline-style: solid;
outline-color: #4caf50;
padding: 20px;
background-color: #ffffff;
font-size: 18px;
text-align: center;
border-radius: 6px;
color: #333;
}
</style>
<div class="outline-width-example">
Contorno con spessore personalizzato 6px
</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.