CSS text-decoration
La proprietà CSS3 text-decoration aggiunge decorazioni visive al testo
La proprietà text-decoration consente di applicare linee decorative al testo, come una sottolineatura, una linea sopra o una linea attraverso. È utile per migliorare la leggibilità o evidenziare contenuti come link o titoli.
Sintassi
Significato dei valori principali:
-
none: Nessuna decorazione applicata al testo.
-
underline: Aggiunge una linea sotto il testo.
-
overline: Aggiunge una linea sopra il testo.
-
line-through: Aggiunge una linea che attraversa il testo.
-
blink: Fa lampeggiare il testo (deprecato e non supportato nei moderni browser).
Esempio proprietà: text-decoration
Codice Esempio: text-decoration
.text-decoration-example {
font-size: 22px;
margin-bottom: 10px;
}.underline {
text-decoration: underline;
}.overline {
text-decoration: overline;
}.line-through {
text-decoration: line-through;
}.none {
text-decoration: none;
}
Contenuto Esempio: text-decoration
Esempio di utilizzo di text-decoration
In questo esempio, la proprietà text-decoration viene utilizzata per applicare diverse decorazioni al testo:
CSS e HTML per l'esempio text-decoration:
<style>
.text-decoration-example {
font-size: 22px;
margin-bottom: 10px;
}
.underline {
text-decoration: underline;
}
.overline {
text-decoration: overline;
}
.line-through {
text-decoration: line-through;
}
.none {
text-decoration: none;
}
</style>
<div class="text-decoration-example underline">Testo sottolineato</div>
<div class="text-decoration-example overline">Testo con linea sopra</div>
<div class="text-decoration-example line-through">Testo barrato</div>
<div class="text-decoration-example none">Testo senza decorazioni</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
