Pregunta tonta sobre estilo para hipervinculo

kasEz · #1 (**permalink**) 05/05/2008, 02:28

Buenas, estoy empezando con CSS y tengo un problema que seguro que es una tonteria pero no atino a resolver.
Con este codigo lo que pretendo es simplemente que en un link (no tiene uso, es simplemente una prueba) tenga una imagen de fondo y al pasar el raton por encima cambie a otra. El codigo es el siguiente:

Código:

<html>
<head>
<TITLE></TITLE>
<link rel="stylesheet" type="text/css" href="../estilos.css" title="default">
<STYLE type="text/css">
A:link {text-decoration:none; background: url(images/fondo1.jpg);}
A:hover {background: url(images/fondo2.jpg);}
</STYLE>
</head>
<body>
<a href="#" style=" background: url(images/fondo1.jpg)" >tururu</a>
</body>
</html>

No me pone ninguna de las 2 imagenes de fondo. :S

pzin · #2 (**permalink**) 05/05/2008, 02:37

Prueba a cambiar background, por background-image. No sé si será eso, pero normalmente con background se especifica color-ruta-repeat-position...

Mikmoro · #3 (**permalink**) 05/05/2008, 02:38

Pues es raro porque el código parece correcto. ¿Seguro que tienes al mismo nivel que tu html una carpeta llamada "images" con las imágenes dentro?

Mikel.

kasEz · #4 (**permalink**) 05/05/2008, 03:22

Cita:

Iniciado por Bonez

Prueba a cambiar background, por background-image. No sé si será eso, pero normalmente con background se especifica color-ruta-repeat-position...

tambien lo he probado y nada

Cita:

Iniciado por Mikmoro

Pues es raro porque el código parece correcto. ¿Seguro que tienes al mismo nivel que tu html una carpeta llamada "images" con las imágenes dentro?

Mikel.

si, de hecho aqui una captura donde se ve
http://img247.imageshack.us/img247/3404/lalalafz8.png

pzin · #5 (**permalink**) 05/05/2008, 03:49

¿Tal vez sea que A no tiene altura o anchra suficiente y no se vea la imagen por eso? Porque está todo bien.

Mikmoro · #6 (**permalink**) 05/05/2008, 05:05

El elemento "a" no necesita altura porque ya tiene un texto que le da tamaño.

¿Y si lo pones así?

<html>
<head>
<title></title>
<link rel="stylesheet" type="text/css" href="estilos.css" title="default">
<style type="text/css">
a {background: url(images/fondo1.jpg);}
a:link {text-decoration:none; background: url(images/fondo1.jpg);}
a:hover {background: url(images/fondo2.jpg);}
</style>
</head>
<body>
<a href="#">tururu</a>
</body>
</html>

Mikel.

guilledocke · #7 (**permalink**) 05/05/2008, 09:08

Otra solucion seria pasarlo a "li" y poner el background en "li:hover", si es que no funciona como"a"

saludos

pzin · #8 (**permalink**) 05/05/2008, 09:23

Cita:

Iniciado por Mikmoro

El elemento "a" no necesita altura porque ya tiene un texto que le da tamaño.

Lo decía por si la imagen que quería poner de fondo, los cuatro laterales tenían el mismo color de fondo. Entonces si la altura no es suficiente hay que aumentarla.

Mikmoro · #9 (**permalink**) 05/05/2008, 11:29

Ah, ya, ya. Como dice que no le sale el fondo, creo que no le sale en absoluto, por eso que con tener algo de tamaño debería verlo, y con el texto deberías ser suficiente. Pero bueno, ya dirá.

Mikel.