Per quanto poco utilizzato conosciamo bene l’importanza di poter barrare un testo per farlo sembrare cancellato senza tuttavia rimuoverlo dalla pagina. Per ottenere questo effetto in puro HTML utilizziamo i tag <s> oppure <del> come spiegato in questa pagina.
Utilizzare gli appositi tag HTML, tuttavia, non è l’unica strada possibile. Grazie all’uso dei CSS, infatti, è possibile ottenere lo stesso risultato.
Per scrivere un testo barrato con CSS si farà ricorso alla proprietà text-decoration, la quale potrà essere applicata ad un qualsiasi tag (un semplice tag <span>, ad esempio, può andare benissimo).
All’interno del nostro foglio di stile creiamo, quindi, una classe "strike" in questo modo:
<style type="text/css">
span.strike
{
text-decoration: line-through;
}
</style>
A generare l’effetto "cancellato", mediante lo sbarramento del testo, è il valore line-through.
Ora utilizziamo questo codice nel sorgente HTML della pagina:
Per fare un testo barrato in HTML si utilizza il <span class="strike">tag strike</span>.
Come potete notare, cliccando sul pulsante, l’effetto barrato verrà applicato alla porzione di testo racchiusa all’interno del tag span con classe "strike".