子元素的CSS不透明度

Question

我知道在CSS中子元素的不透明在技術上是不可能的。 我曾希望通過將外部元素的邊距設置為負數來使用一種變通方法，但是現在不透明度僅顯示在元素上。 我嘗試將其放在上面，並設置z-index不變。

在此處查看完整的JSFiddle： http ： //jsfiddle.net/etP65/1/

#sellbottom {
    z-index:50
margin: -114px 0;
width: 135px;
height: 60px;
border-top: 1px solid #c8d5da;
background-color: #96adb7;
opacity: .8;
padding: 30px 70px;
-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
filter: alpha(opacity=80);
-moz-opacity: .8;
-khtml-opacity: .8;
}

.orangebutton {
margin: 30px 70px;
z-index: 99999;
opacity: 1;
background-color:#62ffff;
}

HTML

<div class="orange-button"></div>
<div id="sellbottom"></div>

Answer 1

請勿在z-index中使用“ px”。 它只需要一個值。 為了使用z-index值，需要定位元素（相對/絕對）。

只需輸入“ position：relative;” 在CSS上的橙色按鈕上-我相信這也將對ie8起作用。

.orangebutton {
    margin: 30px 70px;
    position: relative;
    z-index: 99999;