2016-07-11 25 views
0

問題は不透明度の問題 私は、背景イメージを持つヘッダーがあり、その背景には不透明を実行しようとしていますが、白ではなく黒で作成しようとしています ここでは、コード不透明度の問題

/*Start Header*/ 
 
.header { 
 
\t background-image: url(http://i.imgur.com/FzOVLvC.jpg); 
 
\t -webkit-background-size: cover; 
 
\t -moz-background-size: cover; 
 
\t -0-background-size: cover; 
 
\t background-size: cover; 
 
\t opacity: 0.5; 
 
\t background-color: #000; 
 
\t height: 708px; 
 

 
} 
 
/*End Header*/
<!-- Start Slider --> 
 
\t <div class="header"> 
 
\t \t <div class="slider"> 
 
\t \t \t <div class="contaner"> 
 
\t \t \t \t Slider 
 
\t \t \t </div> 
 
\t \t </div> 
 
\t </div> 
 
<!-- End Slider -->

答えて

1

を真剣に考えている場合は、rgbaまたはhsla機能を使って、あなたの問題を解決することができますRGBA()またはHSLA()関数を使用して色を作成してみてください。それらの行を操作して、その動作を確認してください。 ;)

#p1 {background-color: rgba(255, 0, 0, 0.3);} /* red with opacity */ 
#p2 {background-color: rgba(0, 255, 0, 0.3);} /* green with opacity */ 
#p3 {background-color: rgba(0, 0, 255, 0.3);} /* blue with opacity */ 

#p1 {background-color: hsla(120, 100%, 50%, 0.3);} /* green with opacity */ 
#p2 {background-color: hsla(120, 100%, 75%, 0.3);} /* light green with opacity */ 
#p3 {background-color: hsla(120, 100%, 25%, 0.3);} /* dark green with opacity */ 
#p4 {background-color: hsla(120, 60%, 70%, 0.3);} /* pastel green with opacity */