您现在的位置是:网站首页> 编程资料编程资料
RGBa色彩的浏览器支持分析_CSS教程_CSS_网页制作_
2023-10-31
139人已围观
简介 RGBa色彩的浏览器支持分析小结,需要的朋友可以参考下。
RGBa是一种在CSS中声明包含透明效果的颜色的方法,它的语法是这样的
div {
background: rgba(200, 54, 54, 0.5);
}
div {
background: rgb(200, 54, 54); /* The Fallback */
background: rgba(200, 54, 54, 0.5);
}
不过,这条退路在某些古董级浏览器中依然无效。
复制代码
代码如下:div {
background: rgba(200, 54, 54, 0.5);
}
它允许我们为元素添加透明色。或许我们习惯了使用”opacity“,它很简单易用,但是,opacity会使所有的子元素都变成透明的,而且很难去解决这个问题。(除非使用怪异的定位hack) 跨浏览器透明同样颇为棘手。
通过RGBa,我们可以将一个元素设置为透明,而不会影响其子元素:

声明一个保留颜色
并非所有的浏览器支持RGBa,所以如果允许的话,可以声明一个保留色彩。这个色彩应该是可靠的——所有的浏览器都支持。不声明就意味着,在不支持RGBa的浏览器里面,没有使用颜色。
复制代码
代码如下:div {
background: rgb(200, 54, 54); /* The Fallback */
background: rgba(200, 54, 54, 0.5);
}
不过,这条退路在某些古董级浏览器中依然无效。
RGBa的浏览器支持情况
| 浏览器,版本,操作系统 | 测试结果 | 退路 |
|---|---|---|
| Firefox 3.0.5 (OS X, Windows XP, Vista) | 支持 | — |
| Firefox 2.0.0.18 (PC) | 不支持 | 纯色 |
| Safari 4 (Developer Preview, Mac) | 支持 | — |
| Safari 3.2.1 (PC) | 支持 | — |
| Mobile Safari (iPhone) | 支持 | — |
| Opera 9.6.1 | 不支持 | 纯色 |
| IE 5.5 (PC via IETester) | 不支持 | 无色 |
| IE 6 (PC via IETester) | 不支持 | 纯色 |
| IE 7 | 不支持 | 纯色 |
| IE 8 beta 2 | 不支持 | 纯色 |
| Google Chrome 1.0.154.43 | 支持 | — |
| Google Chrome 1.0.154.46 | 支持 | — |
| Netscape 4.8 (PC) | 不支持 | 没有颜色 |
| SeaMonkey 1.1.14 | 不支持 | 无色 |
| SeaMonkey 1.1.16 | 不支持 | 纯色 |
| SeaMonkey 2.0 beta3 | 支持 | — |
| Sunrise 1.7.5 | 支持 | — |
| 提示:
本文由神整理自网络,如有侵权请联系本站删除!
本站声明: 1、本站所有资源均来源于互联网,不保证100%完整、不提供任何技术支持; 2、本站所发布的文章以及附件仅限用于学习和研究目的;不得将用于商业或者非法用途;否则由此产生的法律后果,本站概不负责!
相关内容
点击排行本栏推荐
|
