將不透明度設置爲父項但不包含子項

我想將不透明度設置爲父div，但不是1個特定的子div。所以我有一個像HTML代碼：將不透明度設置爲父項但不包含子項

body { 
 
    background-image: url(http://url.jpg) 
 
} 
 
#main { 
 
    opacity: 0.9; 
 
} 
 
#slider { 
 
    opacity: 1; 
 
}

<body> 
 
    <div id="main"> 
 
    <div id="slider"> 
 
    </div> 
 
    <div id="content-wrapper"> 
 
    </div> 
 
    </div> 
 
</body>

顯然，這是行不通的。整個#main div現在透明到背景div。這是我想要的，但不是#slider div。出於某種原因，當僅將＃opacity設置爲＃content-wrapper時，根本沒有任何反應。任何想法？

編輯：我不能使用rgba顏色，因爲我想要通過背景圖像。你能解釋爲什麼添加不透明到＃content-wrapper不起作用嗎？

2016-08-24 RobbTe

如果'background'是純色，所以它能夠更好地使用'RGBA（0,0,0，.5）'（顏色按你的要求），而不是'opacity' –

嗨，我不能使用RGB顏色，因爲我想背景圖像來通過。你能解釋爲什麼添加不透明到＃content-wrapper不起作用嗎？ – RobbTe

也許有RGBA或HSLA顏色代碼可以幫助

#someParent { 

background: rgba(0,0,0,0.5); 

}

2016-08-24 12:36:30 Friend

嗨，我不能使用RGB顏色，因爲我想背景圖像來通過。你能解釋爲什麼添加不透明到＃content-wrapper不起作用嗎？ – RobbTe

回答