转载 | 如何实现模块半透明 文字内容不透明？

两种方法

一种是用background:rgba(0, 0, 0, 0.5),兼容性只支持IE8往上另一种方法使用透明度

要考虑IE8往下可以用这个：

<style type="text/css">
.box{
    position:relative;
    width:200px;
    height:200px;
    border:1px solid #666;
    z-index:0;
}

.box .bg{
    background:red;
    position:absolute;
    z-index:-1;
    opacity:0.5;
    filter:alpha(opacity=50);
    width:100%;
    height:100%;
}
</style>

<div class="box">
    <!-- 背景 -->
    <div class="bg"></div>
    <!-- 内容 -->
    <div class="text">
        <p>呵呵，我不受透明度影响！</p>
    </div>
</div>