Lez.11 - Corso Base Css

Decorazione del Testo e la Proprietà text-decoration in un folgio di stile Css

Decorazione del Testo e la proprietà text-decoration

La proprietà text-decoration consente di formattare un testo aggiungendo ad esso delle decorazioni, delle linee che servono a migliorarlo a livello grafico e renderlo più comprensibile.

Sintassi:
selettore {text-decoration: valore ;}

il valore può essere:
none - valore di default, non c'è nessuna decorazione o sottolineatura;

underline - (underline, sotto la linea), il testo sarà sottolineato;

overline - (overline, al di sopra della linea), il testo avrà una linea superiore;

line-through - (line-through, linea attraverso), il testo apparirà attraversato con una linea, cioè apparirà barrato;

Il codice:
<!DOCTYPE html>
<html lang="it">                     
 <head>			    
  <title>Proprietà text-decoration</title>
  <meta charset="utf-8">
  <style type="text/css">
    #pippo1 {
            text-decoration: none;
           }
    #pippo2 {
            text-decoration: overline;
           }
    #pippo3 {
            text-decoration: underline;
           }
    #pippo4 {
            text-decoration: line-through;
           }
  </style>
 </head>
 <body>			    
   <h1>Decorazione o sottolineatura del testo</h1>
   <p id="pippo1">Paragrafo 1 testo per verificare l'effetto del valore  none.</p>
   <p id="pippo2">Paragrafo 2 testo per verificare l'effetto del valore overline.</p>
   <p id="pippo3">Paragrafo 3 testo per verificare l'effetto del valore underline. </p>
   <p id="pippo4">Paragrafo 4 testo per verificare l'effetto del valore line-through.</p>
 </body>               
</html>