我試圖在不透明度爲60%的DIV內添加圖像和文本框。出於某種原因,這兩個對象也繼承了不透明性。我如何防止它?如何在DIV中添加對象並出現在DIV上方
HTML:
<body>
<div id="sliderdiv">
<div id="slider">
<img src="i2.jpg" alt="" />
<img src="i3.jpg" alt="Pure Javascript. No jQuery. No flash." />
<img src="i4.jpg" alt="#htmlcaption" />
<img src="i5.jpg" />
</div>
<div id="htmlcaption" style="display: none;">
<em>HTML</em> caption. Link to <a href="http://www.google.com/">Google</a>.
</div>
</div>
<div id="bg">
<img src="wmlogo.jpg" width="140" height="30" alt="Westmed Medical Group" title="Westmed Medical Group Homepage" id="logoimg" />
<input type=text size=25 id=insidebgtext />
</div>
</body>
CSS:
* {
background-color: #CC0000;
padding: 0px;
margin: 0px;
}
#bg {
position: absolute;
background-color: #000000;
height: 50px;
width: 100%;
opacity:0.6;
filter:alpha(opacity=60); /* For IE8 and earlier */
z-index: 1;
}
#insidebgtext {
position: absolute;
top: 25%;
right: 20%;
background-color: #FFFFFF;
z-index: 25;
}
#sliderdiv
{
position:absolute;
left:0px;
top:0px;
width: 100%;
height: 306px;
z-index:-1;
background-color: #FCFCFC;
}
#logoimg {
position: absolute;
top: 15%;
left: 25%;
z-index: 25;
}
它是如何出現:
你試過給他們一個0的不透明度嗎? – JochemQuery
你應該使用背景顏色代替不透明度來應用rgba的不透明度:.6; –
0的不透明度使對象消失,我將它設置爲1,它只是具有相同的效果... – Si8