Затухание текста

Пример

DEMO

Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. Contrary to popular belief, Lorem Ipsum is not simply random text.

HTML

 <div class="gradient"></div> 

 <div class="gradient2"></div>

CSS

.gradient {
  background: -moz-linear-gradient(bottom, rgba(255, 255, 255, 0.2), #000 100%);
    background: -webkit-linear-gradient(bottom, rgba(255, 255, 255, 0.2), #000 100%);
    background: -o-linear-gradient(bottom, rgba(255, 255, 255, 0.2), #000 100%);
    background: -ms-linear-gradient(bottom, rgba(255, 255, 255, 0.2), #000 100%);
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0.2), #000 100%);	
	height: 100px;
	padding:3px;
}

.gradient2 {
background: -moz-linear-gradient(left, rgba(156, 159, 255, 0.54), #000 100%);
    background: -webkit-linear-gradient(left, rgba(156, 159, 255, 0.54), #000 100%);
    background: -o-linear-gradient(left, rgba(156, 159, 255, 0.54), #000 100%);
    background: -ms-linear-gradient(left, rgba(156, 159, 255, 0.54), #000 100%);
    background: linear-gradient(left, rgba(156, 159, 255, 0.54), #000 100%);	
	height: 100px;
	padding:3px;
}