¿Es posible graduar la opacidad de un elemento HTML?

quiero un<div> Elemento (todo el elemento, contenido y todo) para desvanecerse hacia la parte inferior. Es para truncar una publicación de noticias que debe encajar en un espacio muy restrictivo (y puede contener elementos de tamaño impredecible).

Todo lo que he podido encontrar es para usar un degradado de transparencia en un color de fondo. Lo que estaría bien, excepto detrás de la publicación de noticias, es una imagen de fondo, así que no puedo poner un degradado de color sobre la parte superior del contenido.

Ponía un gradiente de imagen sobre el contenido, pero el fondo se mueve detrás del contenido a medida que el usuario se desplaza.

Así que imagina que esto existía:

opacity: -webkit-linear-gradient( ... );

graduando el actualopacidad Del elemento es lo único que funcionará. ¿Es posible?