转载 | 如何实现模块半透明 文字内容不透明?
两种方法
一种是用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>