CSS text-decoration-line
La proprietà CSS3 text-decoration-line definisce il tipo di linea decorativa del testo
La proprietà text-decoration-line
controlla quali tipi di decorazioni lineari devono essere applicate al testo: sottolineatura, linea sopra o barratura. È particolarmente utile quando si vuole combinare più decorazioni in modo preciso.
Sintassi
Significato dei valori principali:
-
none: Nessuna decorazione applicata.
-
underline: Aggiunge una linea sotto il testo.
-
overline: Aggiunge una linea sopra il testo.
-
line-through: Aggiunge una linea che attraversa il testo.
-
combinazioni multiple: È possibile usare più valori separati da spazi, ad esempio
underline overline
.
Esempio proprietà: text-decoration-line
Codice Esempio: text-decoration-line

.line-example {
font-size: 22px;
margin-bottom: 10px;
}
.underline-line {
text-decoration-line: underline;
}
.overline-line {
text-decoration-line: overline;
}
.line-through-line {
text-decoration-line: line-through;
}
.combo-line {
text-decoration-line: underline overline;
}
Contenuto Esempio: text-decoration-line
Esempio di utilizzo di text-decoration-line
In questo esempio, la proprietà text-decoration-line
viene usata per applicare decorazioni differenti al testo:
CSS e HTML per text-decoration-line
:
<style>
.line-example {
font-size: 22px;
margin-bottom: 10px;
}
.underline-line {
text-decoration-line: underline;
}
.overline-line {
text-decoration-line: overline;
}
.line-through-line {
text-decoration-line: line-through;
}
.combo-line {
text-decoration-line: underline overline;
}
</style>
<div class="line-example underline-line">Testo sottolineato</div>
<div class="line-example overline-line">Testo con linea sopra</div>
<div class="line-example line-through-line">Testo barrato</div>
<div class="line-example combo-line">Testo con sottolineatura e linea sopra</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.