CSS - Texto sobre imágenenes

   
Vista:

Texto sobre imágenenes

Publicado por mariela (1 intervención) el 04/12/2013 12:19:55
Necesito crear un efecto en el que se tenga una imagen y cuando se pase el mouse sobre la imagen, esta se ponga un poco transparente y aparezca un texto informativo sobre la imagen
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de xve

Texto sobre imágenenes

Publicado por xve (349 intervenciones) el 04/12/2013 22:00:27
Hola Mariela, mira este ejemplo... veras que hasta que no pases el ratón por encima de la imagen, no veras el texto:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
<!DOCTYPE html>
<html lang="es">
<head>
    <style>
        .bloque {
            position:relative;
        }
        .imagen {
            position:absolute;
            left:0px;
        }
        .imagen:hover {
            opacity:0.4;
            filter:alpha(opacity=40); /* For IE8 and earlier */
        }
    </style>
</head>
 
<body>
<div class="bloque">
    texto escondido
    <img src="http://www.lawebdelprogramador.com/logolwp100x25.jpg" class="imagen">
</div>
</body>
</html>

Coméntanos, ok?
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
1
Comentar