нижний градиент
img {
width: 400px;
}
.content {
background: rgba(255, 255, 255, 0) linear-gradient(to bottom, rgba(0, 0, 0, 0) 10%, rgba(255, 255, 255, .1) 40%, rgba(255, 255, 255, .5) 75%, rgba(255, 255, 255, 1) 100%) repeat scroll 0 0;
position: relative;
margin-top: -200px;
height: 200px;
}
Glamorous Grebe