CSS » Tachar texto con CSS
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. Ahora es el lenguaje CSS el que nos permite tachar texto.
Para ello 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 la etiqueta HTML <STYLE> dentro de la cabecera de la página HTML. Dentro insertaremos el código CSS.
<style type="text/css"> .tachado{text-decoration:line-through;} </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 elemento <P>. Para ello nos basamos en la propiedad class, indicando el valor del estilo.
<p class="tachado">Este es un esto al que le hemos aplicado el texto tachado, y que por lo tanto va a aparecer tachado.
Artículos relacionados:
Enero 18, 2008 #
gracias!
Mayo 18, 2011 #
No funciona en todos los navegadores
Mayo 18, 2011 #
@José Carlos,
En qué navegador no te ha funcionado?
Acabo de probar en:
* Chrome 11
* Firefox 3.6
* Opera 11
* Safari 4
* Internet Explorer 8
Y funciona en todos correctamente.
Mayo 19, 2011 #
Hola, yo pensaba que funcionaba en todos, pero un cliente me reportó que su página no se veía bien, es una tienda online de ropa donde la talla agotada debía aparecer tachada, para ello hice una clase .outoofstock{text-decoration:line-through;} y en FireFox sin problemas, pero al revisar en otros navegadores observé que IE6 efectivamente no tachaba el texto, busqué en los foros y al parecer ha habido problemas con esto en el pasado.
La movida es que mi cliente me insistía en que con Chrome tampoco le aparecía el texto tachado, finalmente se optó por añadir una nota [agotado].
Saludos y gracias por tu interés.
Mayo 19, 2011 #
@Jose Carlos,
Pues sí, puede ser que en el Internet Explorer 6 no funcione. Lo raro es el tema del Chrome. Muchas gracias por compartir tu comentario y experiencia con nosotros. Creo que son muy enriquecedoras para el resto de visitantes.