Estoy intentando cambiar la opacidad de una foto al achicar la ventana y no logro hacerlo. Lo curioso es que si en vez de cambiar la opacidad coloco un display: none esto si funciona pero no lo primero. Intenté cambiar de tipo de selector CSS y el error sigue ocurriendo. ¿A qué se debe?
html
<div > <img src="gubernamental.jpg" alt="imagen edificio" id="primera-foto"> </div>
css:
#primera-foto {
width: 100%;
height: auto;
bottom: 80px;
opacity: 0.5;
}
@media screen and (max-width: 768px) {
#primera-foto {
width: 50%;
opacity: 1;
}
}
@media only screen and (max-width: 768px) {