rgba背景透明和border透明重叠.

2012年09月20日 0条评论 1,224 views 标签:rgba, 透明度

rgba背景透明和border透明重叠问题.

代码如下:

.box3{width:250px;height:250px;background-color:rgba(255,255,255,0.5);border:5px solid rgba(0,0,0,0.5);}
.box2{width:250px;height:250px;background-color:rgba(0,0,0,0.5);border:5px solid rgba(0,0,0,0.5);}

边框颜色和背景研究叠加在一起了.

原来背景默认从border开始渲染~边框颜色和背景颜色重叠自然不一样~

解决方案:

.box3{width:250px;height:250px;background-color:rgba(255,255,255,0.5);border:5px solid rgba(0,0,0,0.5);background-clip:content-box;}
.box2{width:250px;height:250px;background-color:rgba(0,0,0,0.5);border:5px solid rgba(0,0,0,0.5);background-clip:content-box;}

加上:background-clip:content-box;从content区域开始向外裁剪背景。



无觅M88在线客服插件,快速提升流量

你也可以分享到: