sustituir texto por imagen

[josebenito]

Hola un saludo, estoy intentando sustituir un texto por una imagen pero no consigo hacerlo, se como se hace ya que lo he hecho en el encabezado de mi pagina en la etiqueta h1, pero con esto no consigo hacerlo, a ver si me podeis echar una mano.

<span class="mas_info">mas informacion</span>


.mas_info {
background-image: url(../imagenes/mas_info.jpg);
background-repeat: no-repeat;
text-indent: -9000px;
}

me sale el fondo pero tambien el texto, habia oido lo del dysplay="none" pero calro con esto no me aparece nada. Bueno espero que alguien sepa como solucionarlo, seguro que es una chorrada pero hay que dar con ella.

[elututo]

Creo que lo que estas buscando es tambien que la imagen tenga un link:

Chequeá esto que te puede ayudar:

http://www.elwebmaster.com/articulos...ndo-en-un-link

[Mikmoro]

Pruébalo así:

HTML:
<span class="mas_info">mas informacion<img src="../imagenes/mas_info.jpg" /></span>

CSS:
.mas_info {position: relative;}
.mas_info img {position: absolute; top:0; left:0;}

[josebenito]

gracias por vuestros aportes pero na que no me sale el resultado que quiero, he descubierto una cosa pero hace lo que quiero pero me toca meter codigo extra que no sirve para nada. ya que me salta a otra linea al hacer un parrafo nuevo.
en vez de utilizar la etiqueta :

<span class="mas_info">mas informacion</span>

utilizo lo siguiente si consigo el resultado

<p class="mas_info">mas informacion</p>

debe ser algun problema de la etiqueta span que no deja hacer eso asi que de momento seguire investigando. gracias a los que me habeis echado un cable

[Mikmoro]

¿Estás seguro de haber probado bien mi ejemplo? El texto está, pero no se ve.

Si no es ese el resultado que quieres explícate mejor.

[josebenito]

Tu ejemplo si que funciona he conseguido que la imagen tape al texto de pero hay un pequeño problema y es que si la imagen es mas pequeña que el texto se ve por debajo, al menos es lo que me ocurre a mi ya que he probado con la imagen que tengo con lo de mas informacion (42x16) y se ve que tapa llas letras pero no todo y luego con otra mas grande como la tuya y en efecto lo tapa entero pero pon una frase un poco mas larga y se ve el texto, de todas formas muchas gracias por tu ayuda y u pronta respuesta, buscare una foto mas larga lo suficiente para tapar todo el texto hasta que demos con algo.

P.d. Poniendo el parametro display: block;

.mas_info {
background-image: url(../imagenes/mas_info.jpg);
background-repeat: no-repeat;
text-indent: -9000px;
display: block;

}

parece que hace el efecto deseado pero yo quiero que este seguido del texto precedente y no en otra linea, seguire probando cosas pero para otro dia que ahora me voy de cena a la bodega. Un saludo a todos y gracias

[Mikmoro]

Aumenta el tamaño de la imagen con el color de fondo.

[reimonfranco]

lee esto:

http://www.librosweb.es/css_avanzado..._imagenes.html

saludos ;)