Tag HTML <strike>
Il tag HTML <strike> era obsoleto in HTML5. Scopri perché è stato rimosso e come sostituirlo con <s>, <del> o CSS.
Il tag <strike> veniva utilizzato per visualizzare il testo con una linea orizzontale al centro (testo barrato).
L'elemento <strike> è un tag HTML deprecato ed è obsoleto in HTML5. Non utilizzarlo nei nuovi documenti. Usa <del>, <s> o CSS al suo posto.
Questa pagina spiega cosa faceva <strike>, perché è stato rimosso e — soprattutto — esattamente cosa usare al suo posto. La scelta tra <del>, <s> o semplice CSS dipende da cosa significa il testo barrato, quindi ciascuna alternativa è mostrata con un esempio funzionante qui sotto.
Perché <strike> è stato rimosso
HTML5 ha eliminato <strike> perché descriveva solo come il testo doveva apparire, non cosa significava. Il moderno HTML separa il significato (markup) dall'aspetto (CSS). Una linea attraverso il testo può significare cose molto diverse:
- Il testo è stato eliminato durante una modifica → usa
<del>(spesso abbinato a<ins>per indicare il sostituto). - Il testo non è più accurato o rilevante, ma è mantenuto per contesto → usa
<s>. - La linea è puramente visiva senza alcun significato semantico → usa la proprietà CSS
text-decoration: line-through.
Scegliere l'elemento giusto aiuta anche le tecnologie assistive e i motori di ricerca a comprendere il contenuto, cosa che un generico <strike> non ha mai fatto.
Come appariva il vecchio <strike>
Il tag <strike> veniva usato in coppia, con il contenuto tra il tag di apertura (<strike>) e quello di chiusura (</strike>). I browser lo visualizzano ancora per compatibilità con il passato, ma non dovresti scrivere nuovo codice così:
<!-- Obsolete — do not use in new documents -->
<p><strike>I am studying at the school.</strike></p>
<p>I am studying at the university.</p>
Migrazione da <strike>
Sostituisci ogni <strike> in base al significato del testo barrato.
Opzione 1: <del> per il contenuto eliminato (con <ins>)
Usa <del> quando il testo è stato rimosso durante una modifica. Abbinalo a <ins> per mostrare il sostituto — un esempio classico è un prezzo scontato.
<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
</head>
<body>
<p>Price: <del>$50.00</del> <ins>$39.99</ins></p>
</body>
</html>Il vecchio prezzo è contrassegnato come eliminato e quello nuovo come inserito — la relazione tra loro è ora significativa, non solo visiva.
Opzione 2: <s> per il contenuto non più rilevante
Usa <s> per il contenuto che non è più accurato o rilevante ma che viene mantenuto nella pagina per contesto — ad esempio, un elemento completato o non disponibile in un elenco. Non è destinato alle modifiche dei documenti; usa <del> per quelle.
<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
</head>
<body>
<ul>
<li><s>Buy milk</s> (already done)</li>
<li>Buy bread</li>
<li>Buy eggs</li>
</ul>
</body>
</html>Opzione 3: CSS line-through per il testo barrato puramente visivo
Se la linea non ha alcun significato semantico, usa la proprietà CSS text-decoration su un elemento non semantico come <span> o <p>. Non applicare mai stili all'elemento obsoleto strike — applica la regola a markup valido.
<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
<style>
.struck {
text-decoration: line-through;
}
</style>
</head>
<body>
<p><span class="struck">I am studying at the school.</span></p>
<p>I am studying at the university.</p>
</body>
</html>