我怎样才能让它的相似风格只影响外部元素而不是内部元素

Question

我试图让外部元素具有不透明的影响，并使内部元素保持不变。我尝试使用重要的，但没有奏效。这里是我的代码

<h1 id="outer"><div id="inner">Planet</div></h1> 

和CSS

#outer{ 
     background-color: black; 
     opacity: 0.8; 
    } 

    #inner{ 
     color: white !important; 
    } 

什么是正确的语法这个工作？

Answer 1

使用RGBA相反，您可以使用Alpha通道

#outer{ 
    background-color: rgba(0,0,0,0.8); 
} 

更多地了解RGBA check this out