RGBa色彩的浏览器支持

什么是rgba？它是一种在css中声明包含透明效果的颜色的方法，它的语法是这样的：?div {?? background: rgba(200, 54, 54, 0.5);}
它允许我们为元素添加透明色。或许我们习惯了使用”opacity“，它很简单易用，但是，opacity会使所有的子元素都变成透明的，而且很难去解决这个问题。（除非使用怪异的定位hack） 跨浏览器透明同样颇为棘手。
通过rgba，我们可以将一个元素设置为透明，而不会影响其子元素：
声明一个保留颜色并非所有的浏览器支持rgba，所以如果允许的话，可以声明一个保留色彩。这个色彩应该是可靠的&mdash;—所有的浏览器都支持。不声明就意味着，在不支持rgba的浏览器里面，没有使用颜色。?div {?? background: rgb(200, 54, 54); /* the fallback */?? background: rgba(200, 54, 54, 0.5);}</code>
不过，这条退路在某些古董级浏览器中依然无效。
rgba的浏览器支持情况浏览器，版本，操作系统 测试结果 退路firefox 3.0+ 支持 —?firefox 2.0- 不支持 纯色webkit -safari 3.x+ 支持 —?webkit -safari 2.0- 不支持 –mobile safari (iphone/ipod touch /ipad) 支持 —?opera 10.x+ 支持 —?opera 9.x- 不支持 纯色ie 5.5 - 不支持 无色ie 6-8 不支持 纯色ie 9 支持 —?google chrome 所有版本 支持 —?netscape 所有版本 不支持 没有颜色seamonkey 1.1.x 不支持 无色seamonkey 2.0 + 支持 —?blackberry storm browser 支持 –
上面的数据是通过测试demo得到的，该测试页面包含了更多更完整的浏览器兼容性列表。
对ie浏览器的更好的退路因为ie浏览器支持条件注释，我们可以抛弃rgb并使用ie的一个私有css滤镜来实现同样的效果：?<!--[if ie]>?? <style type=text/css>?? .color-block {?????? background:transparent;?????? filter:progid:dximagetransform.microsoft.gradient(startcolorstr=#99000050,endcolorstr=#99000050);?????? zoom: 1;??? }??? </style><![endif]-->
经过测试发现，rgba颜色可以用于border，不过，不同的浏览器对于border的rgba支持不太一样，不过唯一的不同是，ff在border的拐角处会出现叠加，比如透明度是0.4，那么在ff中，四个角的透明度会变成0.8，而支持rgba的非ff浏览器不会出现这种情况。

seo关键词优化-网站关键词排名下降的主要原因
网站建设有时候不能选择模板建站系统
企业网站用多大空间合适?
解析网站前期优化的技巧都有哪些？
工业互联网与5G、云计算、大数据、人工智能之间的关系
静态网页的设计及发展
设计类网站如何进行设计
怎么判断一个网站优化的程度？