CSS - 在DIV中使用DIV继承不透明度值

Question

如何防止父DIV上的不透明度级别成为子DIV的限制？

 <div style="position: fixed; top: 0; left: 0; right: 0; bottom: 0; opacity: .50; z-index: 1000; background-color:red;">
                            <div style="opacity:1; margin-top:25%; color:white;">
                                <apex:pageMessages />    
                            </div>
                        </div>

现在孩子DIV最多只能达到50％。

Answer 1

使用rgba作为父级的背景颜色（并完全删除不透明度属性）。这允许仅为背景颜色设置透明度，而不是实际元素。

所以而不是

background-color:red;

使用

background-color:rgba(255,0,0,0.5);