Foros del Web » Creando para Internet » CSS »

Crear rollover de capa...

Estas en el tema de Crear rollover de capa... en el foro de CSS en Foros del Web. Hola amigos, vereis tengo el siguiente código CSS Código HTML: <div style= "background:#665e59; width:133px; height:12px; text-align:center; margin:0 0 3px 0; padding:0 0 2px 0;" > ...
  #1 (permalink)  
Antiguo 21/01/2008, 05:52
Avatar de markshock  
Fecha de Ingreso: abril-2004
Ubicación: Allí, al fondo a la izqui
Mensajes: 316
Antigüedad: 13 años, 7 meses
Puntos: 0
Crear rollover de capa...

Hola amigos, vereis tengo el siguiente código CSS

Código HTML:
<div style="background:#665e59; width:133px; height:12px; text-align:center; margin:0 0 3px 0; padding:0 0 2px 0;"><a href="" class="linkBuscar">Productos</a></div> 
Me gustaría que cuando pongo el ratón sobre Productos, el color de la capa cambiara, no consigo hacerlo sin hacerme la picha un lio anidando 3000 capas...

Un saludo y mil gracias de antemano.
__________________
Señoooraaaa!! Que camisetas!!!

"Hay 10 tipos de personas, las que piensan en binario y las que no"
_________________________________
  #2 (permalink)  
Antiguo 21/01/2008, 07:06
 
Fecha de Ingreso: enero-2007
Mensajes: 157
Antigüedad: 10 años, 10 meses
Puntos: 2
Re: Crear rollover de capa...

Hola, es muy facil, está solución es para firefox y para ie7

Código:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es" lang="es">

<head>

<style type="text/css">

div.capa { width:200px; height:200px; background: blue; }

div.capa:hover { background:red }
</style>

</head>

    <body>
    	<div class="capa"></div>
    </body>

</html>
Como veras, le aplicas un estilo a la clase capa para una capa, y luego a esa misma clase le aplicas la pseudo-clase hover que se utiliza para acciones cuando el raton este sobre dicho elemento.

Espero que te sirva, un saludo.
  #3 (permalink)  
Antiguo 21/01/2008, 08:05
Avatar de markshock  
Fecha de Ingreso: abril-2004
Ubicación: Allí, al fondo a la izqui
Mensajes: 316
Antigüedad: 13 años, 7 meses
Puntos: 0
Re: Crear rollover de capa...

Cita:
Iniciado por safranero Ver Mensaje
Hola, es muy facil, está solución es para firefox y para ie7

Código:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es" lang="es">

<head>

<style type="text/css">

div.capa { width:200px; height:200px; background: blue; }

div.capa:hover { background:red }
</style>

</head>


    <body>
    	<div class="capa"></div>
    </body>

</html>
Como veras, le aplicas un estilo a la clase capa para una capa, y luego a esa misma clase le aplicas la pseudo-clase hover que se utiliza para acciones cuando el raton este sobre dicho elemento.

Espero que te sirva, un saludo.

Joeeer.. mira q no caer en eso... ya me vale...!! muchas muchas gracias!!
__________________
Señoooraaaa!! Que camisetas!!!

"Hay 10 tipos de personas, las que piensan en binario y las que no"
_________________________________
  #4 (permalink)  
Antiguo 21/01/2008, 09:28
 
Fecha de Ingreso: enero-2007
Mensajes: 157
Antigüedad: 10 años, 10 meses
Puntos: 2
Re: Crear rollover de capa...

De nada, para eso estamos ;). Yo también he pasado por lo tuyo jaja
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 22:48.