Rodrigo Borrego Bernabé - Freelance Software Developer




Reemplazar texto con imágenes vía CSS

Category : HTML/CSS, Programación · by Mar 22nd, 2011

Motivación

  1. Quiero una imagen en mi botón/enlace/elemento de menú/loquesea
  2. Quiero que los que no vean las imágenes (navegadores modo texto, bots, lectores de pantalla, etc.) tengan un texto equivalente
  3. Quiero que los demás no vean ese texto

HTML:

<div class="miclase">Mi texto alternativo</div>

CSS:

.miclase {
 text-indent: -100em;
 overflow: hidden;
 background: url(miimagen.png) no-repeat;
 height: 100px;
 width: 100px;
 }
SHARE :

Leave a Reply

Your email address will not be published. Required fields are marked *