opacity:0、display:none、visibility:hidden、rgba(0,0,0,0)
opacity:1;は完全表示、opacity:0;は完全非表示だがスペースは残る。display:none;はスペースが残らず消える。visibility:hiddenもスペースは残る。
opacityはIE7以下には未対応なので、filterセレクタを使用する。
/*css*/
/* CSS内 */
#z1 {
opacity:0.4; /*IE8以上他*/
filter:alpha(opacity=40); /*IE7以下*/
}
opacity:1.0
/*css*/
#n1 img {
opacity:1;
}
#m1 {
width:100px;
height:100px;
border:solid 2px #000;
background:#f00;
color:#fff;
margin:10px 20px;
}
1.0
opacity:1.0、display:none;
/*css*/
img {
opacity:1;
display:none;
}
1.0
opacity:1.0、visibility:hidden;
/*css*/
img {
opacity:1;
visibility:hidden;
}
1.0
opacity:0.7
/*css*/
img {
opacity:0.7;
}
0.7
opacity:0.4
/*css*/
img {
opacity:0.4;
}
0.4
opacity:0
/*css*/
img {
opacity:0;
}
0
rgba(r,g,b,a)
CSSプロパティとして新たに加わったアルファチャンネル。
opacity同様に1が不透明、0が完全透明の意味。画像にはopacity、文字とか背景色にはrgbaという時代になるのかな。
/*css*/
#n2 {
width:300px;
height:300px;
background:rgba(255,0,0,0.5);
}
コメントor補足情報orご指摘あればをお願いします。
- << 前のページ
- 次のページ >>
