Foros del Web » Creando para Internet » CSS »

Enlace en una imagen

Estas en el tema de Enlace en una imagen en el foro de CSS en Foros del Web. Hola a todos, bueno el caso es que llevo toda la tarde dandole vueltas pero no me sale Tengo una imagen que hace de fondo ...
  #1 (permalink)  
Antiguo 16/06/2005, 18:42
 
Fecha de Ingreso: mayo-2005
Mensajes: 35
Antigüedad: 12 años, 6 meses
Puntos: 0
Enlace en una imagen

Hola a todos, bueno el caso es que llevo toda la tarde dandole vueltas pero no me sale Tengo una imagen que hace de fondo dentro de una capa y lo que quiero es que al pinchar sobre ella se abra otra ventana, la cuestion es que nose como ponerle el enlace, porque como esta de fondo... Nose si se puede asi, o tengo que ponerla como imagen y entonces darle el enlace, a ver si alguien me dice si se puede hacer de la primera manera.

Saludos
  #2 (permalink)  
Antiguo 17/06/2005, 02:32
Avatar de caricatos
Moderador
 
Fecha de Ingreso: abril-2002
Ubicación: Torremolinos (Málaga)
Mensajes: 19.547
Antigüedad: 15 años, 8 meses
Puntos: 1262
Hola Soriano.e:

A los fondos y estilos no se les puede asociar ningún evento, o sea que tendrás que ponerle el enlace a toda la capa o usar un tag img.

Saludos
__________________
Por favor:
No hagan preguntas de temas de foros en mensajes privados... no las respondo
  #3 (permalink)  
Antiguo 17/06/2005, 03:13
Avatar de CORE
Usuario no validado
 
Fecha de Ingreso: abril-2002
Ubicación: Merida
Mensajes: 2.165
Antigüedad: 15 años, 8 meses
Puntos: 3
Hola
Como dice Caricatos no es posible necesitas hacer algo asi
Código HTML:
<div id="nosotros"><a href="nosotros.php">Nosotros</a></div> 
y en tu hoja solo pones

font-size: 0;

saludos
  #4 (permalink)  
Antiguo 18/06/2005, 11:42
 
Fecha de Ingreso: junio-2005
Mensajes: 6
Antigüedad: 12 años, 6 meses
Puntos: 0
Hola

Me parece lo que responde CORE sobre posicionar el tag <a> de manera absoluta, con contenido de 'font-size: 0', es el camino correcto. Sin embargo, mi aporte es que para hacer coincidir el <a> con la imagen de fondo, y para que puedas "moldearlo" debes quitarle su caracter de elemento de línea con 'display: block'. Hecho esto le das dimensiones como si de un bloque se tratara, y le haces coincidir con la imagen de fondo con width y height. Un consejo, a veces es muy práctico poner 'border: 1 px solid red' a ciertas clases o ids para poder "verlos" en el browser mientras los posicionas.

¡Un saludo!

Carlos
  #5 (permalink)  
Antiguo 18/06/2005, 14:42
Avatar de CORE
Usuario no validado
 
Fecha de Ingreso: abril-2002
Ubicación: Merida
Mensajes: 2.165
Antigüedad: 15 años, 8 meses
Puntos: 3
A lo que dice carlos el codigo seria

Código HTML:
div#nosotros a{
	background-image: url(img/nosotros_1.png);
	background-repeat: no-repeat;
	display: block;
	height: 104px;
	width: 123px;
	font-size: 0;
}
algo asi

saludos
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 05:17.