Mostrar texto tachonado con CSS

Por ejemplo para mostrar un producto en oferta es interesante mostrar a los clientes el antiguo precio y el actual para visualizar la diferencia. El antiguo precio tachonado queda bastante bien.

Para mostrar un texto tachonado se puede hacer de la siguiente forma:

Lo primero que debes hacer es crear una clase en un archivo .css de la siguiente forma para tener preparado el estilo deseado para el texto.

.tachonado {

text-decoration: line-through;

}

Seguidamente en tu código HTML o PHP puedes invocar a esta clase de la siguiente forma:

<div class="tachonado">Texto tachonado</div> o

<span class="tachonado">Texto tachonado</span>

También podríamos conseguir este efecto vía HTML con la etiqueta <strike> que es soportada por la mayoría de navegadores:

<strike>Texto tachonado</strike>

Ver ejemplo en funcionamiento