En las primeras versiones del lenguaje HTML existían las etiquetas strike y s, las cuales nos permitían tachar texto dentro de nuestra página web, ya que en estas versiones estaba mezclado la estructura con la forma en la que se representaba. A partir de HTML 4.01 se establece la separación del contenido y la representación del mismo con la creación de CSS, y es este el que nos permite tachar texto con CSS.
Para tachar texto con CSS nos tenemos que basar en la propiedad text-decoration y en el valor «line-through». En primer lugar definiremos el estilo que va a representar el texto tachado. Para ello utilizamos el elemento style de HTML dentro de la cabecera de la página HTML. Dentro insertaremos el código CSS.
.tachado{
text-decoration:line-through;
}
Es importante que este código CSSlo pongamos dentro de una hoja de estilos que importemos en la página o directamente en la página mediante el elemento style.
Ahora solo nos quedará el aplicar el estilo «tachado» a un elemento de la página HTML. En nuestro caso vamos a hacerlo sobre un párrafo de texto. El párrafo de texto en HTML se representa mediante el elemento p. Para ello nos basamos en el atributo class, indicando el valor del estilo.
Este es un párrafo de texto al que le hemos aplicado el texto tachado mediante la clase «tachado» y el atributo class, y que por lo tanto va a aparecer tachado.
<p class="tachado">Este es un texto al que le hemos aplicado el texto tachado, y que por lo tanto va a aparecer tachado.</p>
Por pantalla veremos algo parecido a lo siguiente:
Este es un texto al que le hemos aplicado el texto tachado, y que por lo tanto va a aparecer tachado.
Y de esta sencilla forma hemos conseguido tachar texto con CSS. ¿Lo has utilizado o lo vas a utilizar cuando creas tus diseños web? Cuéntanos tu experiencia y cómo y dónde has utilizado esta forma de manejar el texto o dónde piensas utilizarlo en los comentarios.
