質問: FC2ブログの共有テンプレートで「crystallization」をダウンロードしてイロイロやってみているのですが、 画像をUPすると透過されてしまって画像と背景がかぶってしまいます。 どうにかして画像だけきれいに表示
回答: 問題はこの下からの五行にあり、 #contents { width:750px; text-align:left; margin-left:auto; margin-right:auto; padding:0px; border:1px dotted #666; background-color:#000; filter:alpha(opacity=60); /*IE5、IE5.5、IE6、IE7*/ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)"; /*IE8?*/ -ms-filter: "aplpha(opacity=0.6)"; /*IE8*/ -moz-opacity: 0.5; /*Firefox*/ opacity: .6; /*Opera9.0+、Firefox1.5+、Safari、Chrome*/ } これは背景を半透明にするばかりでなく、あなたが見たように、写真なども半透明にするという「余計なオマケ」が付く。 それで最近はこの方法が用いられなくなってきている。 どうするかというと、自分で「クロ」 60% 不透明という png 画像を用いる。これを「アルファチャンネル付き png 」というが。 pictbear を持っているなら、カンタンに作れる。 ホントはもっと単純な指定方法があるのだが、使用者の多い internet explorer 7.0/80. がそれに対応していないために、已むなく「アルファチャンネル付き png 」を背景画像とせざるを得ない。 そうすれば、このように半透明にならなくすることができる。 background: url(「アルファチャンネル付き png 」URL); ――――――――――――――――――――――――――――――――― #contents { width:750px; text-align:left; margin-left:auto; margin-right:auto; padding:0px; border:1px dotted #666; background: url(URL.png); }