CSS父级设置了透明，其中一个子元素怎么不透明？

Question

布局有很多级，除了其中一个子元素之外其他所有元素要同时设置透明度。

搜了很多都是通过rgba设置父级元素的background，但这只是背景透明。

实在不行就只能给每个元素单独设置透明度了。

<div style="opacity:0.5">
    <div>
        <span>标题</span>
    </div>
    <div>
        <div>
            <img>
        </div>
        <div>    <!-- 这个div不透明 -->
            <span>标题</span>
        </div>
    </div>
    <div>
        <div class ="">
            <img>
        </div>
    </div>
</div>

Answer 1

你给父元素设置opacity，它的子元素就全是这个opacity了，你想让某个元素不透明，只能把它拿外面，然后定位到指定位置。或者就是父元素rgba，子元素单独设置opacity了