背景のみ半透明にするCSS

css関連
2014年2月20日

背景を半透明にしたい場合、filterやopacity等で対応してきたが
これでは背景のみならず、ボックス全体が透けてしまうので、背景のみ
半透明にする方法を。

これまでは

background-color:#000;
filter:alpha(opacity=65);
-moz-opacity:0.65;
-khtml-opacity:0.65;
opacity:0.65;

これだと全部半透明。で、これを以下のように変えてみる

filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#99ffffff,EndColorStr=#99ffffff);
background-color: rgba(255, 255, 255, 0.5);

これは大丈夫。つまりrgbaでしてすると言うこと。IE8,7では反映されないかも。
確実なのはpng等の半透明画像で対応する方が確実。
特に仕事の場合は。

PAGE TOP