CSS: Reemplazar texto con imágenes

El método más simple que he encontrado para reemplazar texto con imágenes, por ejemplo, para hacer más vistosos los títulos en una web y no perder la semántica del HTML, es el de text-indent (creado por Mike Rundle).

Solo se necesita:

h1 {
  text-indent: -9000px;
  background: url(image.jpg) no-repeat 0 0;
  width: 200px; /* Ancho de la imagen */
  height: 80px; /* Alto de la imagen */
}

Lo encontré en esta presentación super intersante sobre tipografía para Web.

Leave a Reply

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

Are you human? *