Foros del Web » Creando para Internet » CSS »

fondo de un color encima de un enlace

Estas en el tema de fondo de un color encima de un enlace en el foro de CSS en Foros del Web. hola personas... tengo esta problemática que no se como solucionarla... estoy haciendo una página en donde pongo un enlace y cuando alguien pasa el mouse ...
  #1 (permalink)  
Antiguo 11/07/2011, 07:32
Avatar de torturo  
Fecha de Ingreso: octubre-2003
Ubicación: Cozumel y Cancun
Mensajes: 61
Antigüedad: 13 años, 9 meses
Puntos: 1
fondo de un color encima de un enlace

hola personas... tengo esta problemática que no se como solucionarla...

estoy haciendo una página en donde pongo un enlace y cuando alguien pasa el mouse sobre el enlace este quisiera que ponga una imagen ARRIBA del enlace... no sé si me estoy explicando... ya he leido que con CSS puedo ponerle un background atrás del enlace... pero lo que quiero es que quede ARRIBA de ella (ponerlo SOBRE el enleace) les dejo lo que llego en html y css:

HTML:
Cita:
<div class="mimenu">
<ul>
<li><a href="http://google.com">Google</a></li>
<li><a href="http://google.com">Google</a></li>
</ul>
</div>

CSS

Cita:
body{padding:0px; margin:0px;}
.principal{width:950px; margin:0px auto; padding:0px}
.mimenu ul{list-style-type: none; padding:0px; margin:0px; margin-top:10px;}
.mimenu li{float:left; list-style-type: none; padding: 0px 5px; }
.mimenu li a{color:red; }
.mimenu li a:hover{color:red; background-position: 10px; background-color: black; }
o he encontrado la forma aún... agradecería a alguien que pudiera ayuar...
  #2 (permalink)  
Antiguo 11/07/2011, 07:41
Avatar de GAST0N  
Fecha de Ingreso: agosto-2010
Ubicación: Buenos Aires
Mensajes: 680
Antigüedad: 6 años, 11 meses
Puntos: 64
Respuesta: fondo de un color encima de un enlace

agrega al css lo siguiente

li:hover {background-image:"LA URL DE TU IMAGEN" ;}

saludos!!
__________________
Twitter: @GastonArnedo

Muerte a los <tr> y <td>
  #3 (permalink)  
Antiguo 11/07/2011, 07:44
Avatar de torturo  
Fecha de Ingreso: octubre-2003
Ubicación: Cozumel y Cancun
Mensajes: 61
Antigüedad: 13 años, 9 meses
Puntos: 1
De acuerdo Respuesta: fondo de un color encima de un enlace

lo que quiero es que sse ponga una barrita azul a la parte de arriba del enlace (del LI) por eso uso background-color y no image...
pero nohe logrado hacer que se ponga encima del LI
  #4 (permalink)  
Antiguo 11/07/2011, 07:48
Avatar de GAST0N  
Fecha de Ingreso: agosto-2010
Ubicación: Buenos Aires
Mensajes: 680
Antigüedad: 6 años, 11 meses
Puntos: 64
Respuesta: fondo de un color encima de un enlace

Cita:
Iniciado por torturo Ver Mensaje
lo que quiero es que sse ponga una barrita azul a la parte de arriba del enlace (del LI) por eso uso background-color y no image...
pero nohe logrado hacer que se ponga encima del LI
no le pongas position al hover.. solo el color de fondo
__________________
Twitter: @GastonArnedo

Muerte a los <tr> y <td>
  #5 (permalink)  
Antiguo 11/07/2011, 07:50
Avatar de torturo  
Fecha de Ingreso: octubre-2003
Ubicación: Cozumel y Cancun
Mensajes: 61
Antigüedad: 13 años, 9 meses
Puntos: 1
Respuesta: fondo de un color encima de un enlace

eso hice pero se pone atrás del enlace... y no quiero que se ponga atrás... quiero que te pona ENCIMA:
ejemplo

======= (elos signos de igual repretengan la barrita con el color azul)
ENLACE
  #6 (permalink)  
Antiguo 11/07/2011, 07:58
Avatar de GAST0N  
Fecha de Ingreso: agosto-2010
Ubicación: Buenos Aires
Mensajes: 680
Antigüedad: 6 años, 11 meses
Puntos: 64
Respuesta: fondo de un color encima de un enlace

que tal asi:

.mimenu li a:hover{color:black; background-color: black; }

de esa manera quedaria todo negro
__________________
Twitter: @GastonArnedo

Muerte a los <tr> y <td>
  #7 (permalink)  
Antiguo 11/07/2011, 08:00
Avatar de torturo  
Fecha de Ingreso: octubre-2003
Ubicación: Cozumel y Cancun
Mensajes: 61
Antigüedad: 13 años, 9 meses
Puntos: 1
Respuesta: fondo de un color encima de un enlace

así es, quedaría todo negro, pero lo que quisiera es que queda sólo la parte de arriba... encima del texto
  #8 (permalink)  
Antiguo 08/01/2012, 06:05
 
Fecha de Ingreso: junio-2002
Ubicación: Madrid, España
Mensajes: 22
Antigüedad: 15 años, 1 mes
Puntos: 2
Respuesta: fondo de un color encima de un enlace

Aunque el tema es antiguo, respondo aquí por si alguien se encuentra en el mismo caso:

Ponle al li a:hover un border-top: 8px solid blue; (o los valores que quieras).

Para controlar la separación de la barrita juega con padding-top.

Un saludo
  #9 (permalink)  
Antiguo 08/01/2012, 06:09
 
Fecha de Ingreso: febrero-2011
Mensajes: 6
Antigüedad: 6 años, 5 meses
Puntos: 0
Respuesta: fondo de un color encima de un enlace

Excelente respuesta eficaz y sencilla y así te ahorras el peso de la imagen.

Etiquetas: color, encima, enlace, fondo
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 10:31.