▼opacity

今日は、バイト休み！！やった！！

とりあえずちゃんとサイトを仕上げる事を目標にがんばります

今回は

サイト制作をしていく中でわからない事がありすぎて調べまくったことをかいていきたいと思います

▼opacity / RGBa

要素に透過度をしていするプロパティ

opacity : 

.box { opacity : 0.8; }

(0.1/ 0.8 / 0.555など、小数点以下指定可能)

E・Firefox・Opera・Netscape・Safari

filter : alpha ( opacity : 25)   ←IE 100が100％

-moz-opacity : 0.25; ←Firefox, Netscape

opacity : 0.25 ; ←Opera, Safari

やり方としては、こんな感じ。

ブラウザ上では、こんな感じ

こつは、position:relative;で透過させたくないところを指定することです。

ただ、ここで私を苦しめた点がありますw

「背景だけを透過させる」

これは2日悩まされましたw

調べて自分なりに解決した事

背景だけを半透明にするにはopacityではなく、rgbaを使う。
opacityは透明度を指定することができるスタイルで、子要素を含めて透明になる。
一方、rgbaは色とその透明度をしているすることができ、自要素は透明になるが子要素は透明にならない。

参考：http://index-japan.jp/?p=1732

例）

このように、全体が透明になってしまう

できました！

こんなことに何時間もかけて悔しいですが、以外と調べてみるとみんな苦しんでるみたいw

あたしだけじゃないんだなって、安心しましたw

さて、今日はがんばらねば！！