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

文章简介:rgba背景透明和border透明重叠问题.

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

代码如下:

1
2

.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开始渲染~边框颜色和背景颜色重叠自然不一样~

解决方案:

1
2

.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区域开始向外裁剪背景。

时间: 2024-10-31 06:22:26

rgba背景透明和border透明重叠问题的相关文章

html-怎么让页面背景透明 内容不透明

问题描述 怎么让页面背景透明 内容不透明 如题 怎么写 可以上页面背景透明 背景上的内容不透明,而且当滚动条移动时 中间不透明的框框不动.提供一个思路即可..感觉现在无从下手.类似图片这样的 解决方案 透明度参考: 前三个参数是颜色,后一个是透明度,效果为白色背景透明 background-color: rgba(255,255,255,0.2); 内容不动参考: 定位为固定不动 position:fixed http://blog.csdn.net/qq_19558705/article/de

ie7+背景透明文字不透明超级简单的实现方法_javascript技巧

如果你现在还在为背景透明文字不透明而发愁的话,建议你来看看.当然IE6我已经放弃了,所以不要说不用PNG8的图片这样在IE6下没有效果,当然你也可以用滤镜.本人不建议使用滤镜.因为这样可能会出现其它问题!(如无法点击等等问题)做前端最怕的就是BUG,特别是IE6.滚蛋IE6!本文的核心就是利用PNG32透明图片来做背景然后平铺背景就行了.这样就不会存在背景透明文字也透明了.这样做起来超级简单你们说呢!图片只需要调整透明度即可.在PSD中把图片设置为20%的透明度保存为png就行了.(切忌:不要设

win7系统画图程序背景怎么设为透明

win7系统画图程序背景怎么设为透明 1.打开图画软件,进入工作界面; 2.选好红色,再按住shift键,画一个标准的圆形; 3.用选择工具将它选中后,在编辑菜单按复制(或者按ctrl+C); 4.再在编辑菜单按粘贴或按ctrl+v粘贴一个圆形; 5.将复制的圆形用移动工具,移到下面和第一个圆相交; 6.发现第二个圆将第一个圆遮住了一部分,很不美观; 7.我们只要选择下面第二个透明模式,就可以解决这个问题.

framebuffer-怎么设置qws背景透明和Framebuffer透明

问题描述 怎么设置qws背景透明和Framebuffer透明 怎么设置qws背景透明和Framebuffer透明!!!!!!!!!!!!!!!!!!! 解决方案 http://blog.chinaunix.net/uid-14966892-id-2780391.html 解决方案二: 求大神出现啊!!!!!!!!一直在线苦等!!!!!!!!!!!!!

PS如何将不透明图片变为透明图片

  Photoshop如何将不透明图片变为透明图片?下面百事网小编带领大家一起看下Photoshop将不透明图片变为透明图片的教程. 1.使用Photoshop软件打开本例的素材.一张带有"示例文字"字样的图片. 2.打开图片时图片默认为背景图层.此时应用鼠标双击图层工具栏(一般在右下方)的"背景"二字,将图片放到一个新建的图层上. 3.上述操作执行完毕后,原来写有"背景"字样的图层会被改写为"图层0"(刚刚指定的名称). 4

防火墙的透明模式和透明代理

随着防火墙技术的发展,安全性高.操作简便.界面友好的防火墙逐渐成为市场热点.在这种情况下,可以大大简化防火墙设置.提高安全性能的透明模式和透明代理就成为衡量产品性能的重要指标.于是在推荐产品的过程中,很多厂商往往会介绍自己的产品实现了透明模式和透明代理.那么究竟什么是透明模式和透明代理呢?他们之间又有何关系呢?下面我们将做具体分析. 透明模式,顾名思义,首要的特点就是对用户是透明的(Transparent),即用户意识不到防火墙的存在.要想实现透明模式,防火墙必须在没有IP地址的情况下工作,不需

防火墙的透明模式和透明代理技术

随着防火墙技术的发展,安全性高.操作简便.界面友好的防火墙逐渐成为市场热点.在这种情况下,可以大大简化防火墙设置.提高安全性能的透明模式和透明代理就成为衡量产品性能的重要指标.于是在推荐产品的过程中,很多厂商往往会介绍自己的产品实现了透明模式和透明代理.那么究竟什么是透明模式和透明代理呢?他们之间又有何关系呢?下面我们将做具体分析. 透明模式,顾名思义,首要的特点就是对用户是透明的(Transparent),即用户意识不到防火墙的存在.要想实现透明模式,防火墙必须在没有IP地址的情况下工作,不需

CSS通过RGBa将一个元素设置为透明效果

 RGBa是一种在CSS中声明包含透明效果的颜色的方法,它的语法是这样的: 代码如下: div { background: rgba(200, 54, 54, 0.5); } 它允许我们为元素添加透明色.或许我们习惯了使用"opacity",它很简单易用,但是,opacity会使所有的子元素都变成透明的,而且很难去解决这个问题.(除非使用怪异的定位hack) 跨浏览器透明同样颇为棘手. 通过RGBa,我们可以将一个元素设置为透明,而不会影响其子元素:   声明一个保留颜色 并非所有的浏

透明图片-C# 透明背景图片保存

问题描述 C# 透明背景图片保存 代码如下:Bitmap bmp = new Bitmap(@""D:site1.jpg""); Graphics g = Graphics.FromImage(bmp); String str = name; Font font = new Font(""时尚中黑简体"" size FontStyle.Bold); SolidBrush sbrush = new SolidBrush(Colo