CSS3教程(9):设置RGB颜色


Posted in HTML / CSS onApril 02, 2009

使用新的CSS3的”RGBA”声明,不仅仅让我们像通常一样设置RGB颜色,而且还可以设置其透明度。
使用新的CSS3的”RGBA”声明,不仅仅让我们像通常一样设置RGB颜色,而且还可以设置其透明度。
上一篇文章:CSS3教程(8):CSS3透明度指南
RGBA像RGB一样设置颜色,而这个”A”——RGBA中的最后一个值——允许我们设置该元素的透明度。就像opacity声明一样,一个opacity值为1的元素是完全不透明的,而一个opacity为0的元素是完全透明的。
浏览器兼容性
RGBA现在在Firefox、Google Chrome和Safari中都有比较好的支持,同样不需要前缀。 CSS3 RGBA 色彩
CSS3教程(9):设置RGB颜色
上面的效果有以下样式实现:
div.rgbaL1 { background:rgba(153, 134, 117, 0.2); height:20px; } div.rgbaL2 { background:rgba(153, 134, 117, 0.4); height:20px; } div.rgbaL3 { background:rgba(153, 134, 117, 0.6); height:20px; } div.rgbaL4 { background:rgba(153, 134, 117, 0.8); height:20px; } div.rgbaL5 { background:rgba(153, 134, 117, 1.0); height:20px; }
浏览器支持

  • Firefox(3.05 …)
  • Google Chrome(1.0.154 …)
  • Google Chrome(2.0.156 …)
  • Internet Explorer(IE7, IE8 RC1 )
  • Opera(9.6 …)
  • Safari(3.2.1 windows…)
HTML / CSS 相关文章推荐
多重CSS背景动画实现方法示例
Apr 04 HTML / CSS
CSS3 中的@keyframes介绍
Sep 02 HTML / CSS
基于CSS3制作立体效果导航菜单
Jan 12 HTML / CSS
CSS3标注引用的出处和来源的方法
Feb 25 HTML / CSS
纯CSS3实现圆圈动态发光特效动画的示例代码
Mar 08 HTML / CSS
利用简洁的图片预加载组件提升html5移动页面的用户体验
Mar 11 HTML / CSS
HTML 5 input placeholder 属性如何完美兼任ie
May 12 HTML / CSS
HTML5为输入框添加语音输入功能的实现方法
Feb 06 HTML / CSS
详解Canvas实用库Fabric.js使用手册
Jan 07 HTML / CSS
html如何对span设置宽度
Oct 30 HTML / CSS
HTML利用九宫格原理进行网页布局
Mar 13 HTML / CSS
关于CSS自定义属性与前端页面的主题切换问题
Mar 21 HTML / CSS
CSS教程:CSS3圆角属性
Apr 02 #HTML / CSS
CSS3的新特性介绍
Oct 31 #HTML / CSS
CSS3属性选择符介绍
Oct 17 #HTML / CSS
CSS3教程:background-clip和background-origin
Oct 17 #HTML / CSS
细说CSS3中的选择符
Oct 17 #HTML / CSS
css3 给背景设置渐变色的方法
Sep 12 #HTML / CSS
css3中用animation的steps属性制作帧动画
Apr 25 #HTML / CSS
You might like
两种php调用Java对象的方法
2006/10/09 PHP
php异常处理使用示例
2014/02/25 PHP
PHP基于GD库的缩略图生成代码(支持jpg,gif,png格式)
2014/06/19 PHP
Web程序工作原理详解
2014/12/25 PHP
php自定义hash函数实例
2015/05/05 PHP
php自定义类fsocket模拟post或get请求的方法
2015/07/31 PHP
服务器迁移php版本不同可能诱发的问题
2015/12/22 PHP
php基于websocket搭建简易聊天室实践
2016/10/24 PHP
PHP实现绘制二叉树图形显示功能详解【包括二叉搜索树、平衡树及红黑树】
2017/11/16 PHP
PHP性能分析工具xhprof的安装使用与注意事项
2017/12/19 PHP
Laravel 解决composer相关操作提示php相关异常的问题
2019/10/23 PHP
使用正则替换变量
2007/05/05 Javascript
javascript 常用关键字列表集合
2007/12/04 Javascript
Jquery Ajax 学习实例2 向页面发出请求 返回JSon格式数据
2010/03/15 Javascript
jQuery使用fadein方法实现渐出效果实例
2015/03/27 Javascript
jQuery简单实现仿京东商城的左侧菜单效果代码
2015/09/09 Javascript
全面解析JavaScript里的循环方法之forEach,for-in,for-of
2020/04/20 Javascript
js html css实现复选框全选与反选
2016/10/09 Javascript
微信小程序  modal弹框组件详解
2016/10/27 Javascript
基于JavaScript实现轮播图原理及示例
2020/04/10 Javascript
Angular通过angular-cli来搭建web前端项目的方法
2017/07/27 Javascript
JS引用传递与值传递的区别与用法分析
2018/06/01 Javascript
angular 实现同步验证器跨字段验证的方法
2019/04/11 Javascript
原生js代码能实现call和bind吗
2019/07/31 Javascript
浅析vue中的provide / inject 有什么用处
2019/11/10 Javascript
Element Rate 评分的使用方法
2020/07/27 Javascript
归纳整理Python中的控制流语句的知识点
2015/04/14 Python
Python for Informatics 第11章之正则表达式(四)
2016/04/21 Python
python基础while循环及if判断的实例讲解
2017/08/25 Python
浅谈Python2之汉字编码为unicode的问题(即类似\xc3\xa4)
2019/08/12 Python
h5实现获取用户地理定位的实例代码
2017/07/17 HTML / CSS
英国运动服、设备及配件网站:DW Sports
2019/12/04 全球购物
动漫专业高职生职业生涯规划书
2014/02/15 职场文书
教师查摆问题自查报告
2014/10/11 职场文书
小学优秀教师先进事迹材料
2014/12/16 职场文书
2015年万圣节活动总结
2015/03/24 职场文书