子元素默认会继承父元素透明度的解决方法

方案1.opacity默认子元素会继承;
一般不想要继承的情况下用rgba 的效果很好 background:rgba(0,0,0,.5) ;

存在问题: (1).iE7,8 不支持rgba

               (2). 如果父元素采用的是渐变颜色 无法用 rgba

方案2. 抛弃子元素方法 ,采用定位模拟子元素 可解决 方案1中问题
<div class="container">  //position: relative
<div class="background"></div> //opacity: 0.5, width: 100%, height: 100%  
<div class="children"></div> // position: absolute, width: 100%, height: 100%, top: 0, left: 0
</div>

猜你喜欢

转载自www.cnblogs.com/boyq/p/12093827.html
今日推荐