No me funciona este código

[Luisa29]

Las imágenes no hacen nada al pasar el ratón, no sé en qué puede estar el fallo.



<style type="text/css">
a.opacidad img {
filter:alpha(opacity=50);
-moz-opacity: 0.5;
opacity: 0.5;
-khtml-opacity: 0.5;}

a.opacidad:hover img {
filter:alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0;
-khtml-opacity: 1.0; }

</style>


<table width="68" border="0">
<tr>
<th scope="col"><a href="#" onclick="Cargar('legumbres.txt');"><img src="miniaturas/image1.jpg" width="60" height="34" class="opacidad" title="Legumbres" /></a></th>
<tr>
<th scope="col"><a href="#" onclick="Cargar('macarrones.txt');"><img src=img src="miniaturas/image2.jpg" width="60" height="34" class="opacidad" title="Macarrones" /></a></th>
</tr>
</table>

[pzin]

No funciona porque en tu selector tienes puesto "una imagen que esté dentro de un enlace con clase opacidad", cuando debería de ser "una imagen con clase opacidad".

Código CSS:

img.opacidad {}
 

Usa highlight para cuando posteas código. Es por cuidarnos la vista.

[Luisa29]

Con eso me salen todas las imágenes de mi web con opacidad, pero tampoco hacen nada los links. ¿Estoy haciendo algo mal? ¿podrías ponerme como quedaría el código modificado?

[pzin]

Pensaba que era evidente que luego tendrías que aplicar tu :hover donde lo necesites.

Código CSS:

a:hover img.opacidad {}
 

De todas formas con img.opacidad sólo se pondrán con la opacidad que indiques las imágenes que tengan la clase opacidad. Si salieron todas las imágenes así, entonces o bien todas tienen esa clase o hiciste algo mal.