前回に引き続き, ieでalphaチャンネル付きPNGを表示させる(ように見せる)方法. 今回は, blogでよくあるデザインで「Entryの背景を半透明にする」です. どんなものかは, サンプルを見た方が早いでしょう.
ポイント…といってに大してないです. Entry部分のstyle sheetは以下のようになってます.
background-で始まる2行でblogbodyの背景にalphaチャンネル付きのPNGを張って, 透けさせています. ただ, これではieで透けないのでfilter:alphaでblogbody自体の不透明度 を90%にしています. ie以外ではfilter:alphaは解釈できないので無視されます.
注意すべき点は2点. 1つはblogbody全体が透けるので, 文字やimageも透けます. なので不透明度を下げすぎると文字まで見えなくなります.
もう一つは, ieの場合alphaチャンネル付のPNGを表示させると, alphaチャンネル付きの箇所が水色になってしまう. これはブラウザ見てcss切り替える等の事をする必要があると思います.
