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 相关文章推荐
使用CSS3实现字体颜色渐变的实现
Mar 09 HTML / CSS
推荐10个CSS3 制作的创意下拉菜单效果
Feb 11 HTML / CSS
CSS3网格的三个新特性详解
Apr 04 HTML / CSS
纯CSS绘制漂亮的圆形图案效果
May 07 HTML / CSS
详解css position 5种不同的值的用法
Jul 30 HTML / CSS
使用Canvas操作像素的方法
Jun 14 HTML / CSS
HTML5资源预加载(Link prefetch)详细介绍(给你的网页加速)
May 07 HTML / CSS
用HTML5 实现橡皮擦的涂抹效果的教程
May 11 HTML / CSS
HTML5+WebSocket实现多文件同时上传的实例
Dec 29 HTML / CSS
Html5同时支持多端sdk的小技巧
Nov 17 HTML / CSS
基于CSS制作创意端午节专属加载特效
Jun 01 HTML / CSS
CSS实现背景图片全屏铺满自适应的3种方式
Jul 07 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
ThinkPHP登录功能的实现方法
2014/08/20 PHP
浅析php创建者模式
2014/11/25 PHP
PHP读书笔记_运算符详解
2016/07/01 PHP
Yaf框架封装的MySQL数据库操作示例
2019/03/06 PHP
Laravel框架实现多数据库连接操作详解
2019/07/12 PHP
对联广告js flash激活
2006/10/19 Javascript
js jquery ajax的几种用法总结(及优缺点介绍)
2014/01/28 Javascript
JS的参数传递示例介绍
2014/02/08 Javascript
js触发onchange事件的方法说明
2014/03/08 Javascript
浅析webapp框架AngularUI的demo
2014/12/21 Javascript
javascript图片预加载实例分析
2015/07/16 Javascript
Adapter适配器模式在JavaScript设计模式编程中的运用分析
2016/05/18 Javascript
jQuery鼠标事件总结
2016/10/13 Javascript
第一次接触神奇的前端框架vue.js
2016/12/01 Javascript
jquery对象与DOM对象转化
2017/02/08 Javascript
JS组件系列之MVVM组件构建自己的Vue组件
2017/04/28 Javascript
jquery中done和then的区别(详解)
2017/12/19 jQuery
微信小程序自定义底部导航带跳转功能
2018/11/27 Javascript
TypeScript中的方法重载详解
2019/04/12 Javascript
JS计算斐波拉切代码实例
2019/09/12 Javascript
[33:17]OG vs VGJ.T 2018国际邀请赛小组赛BO2 第二场 8.18
2018/08/19 DOTA
python监控网站运行异常并发送邮件的方法
2015/03/13 Python
python 获取当天每个准点时间戳的实例
2018/05/22 Python
Python3 导入上级目录中的模块实例
2019/02/16 Python
numpy和pandas中数组的合并、拉直和重塑实例
2019/06/28 Python
基于Tensorflow使用CPU而不用GPU问题的解决
2020/02/07 Python
Python3.7下安装pyqt5的方法步骤(图文)
2020/05/12 Python
Python CategoricalDtype自定义排序实现原理解析
2020/09/11 Python
详解Pycharm第三方库的安装及使用方法
2020/12/29 Python
html5读取本地文件示例代码
2014/04/22 HTML / CSS
中国领先的专业演出票务网:永乐票务
2016/08/29 全球购物
结婚邀请函范文
2014/01/14 职场文书
办公室秘书岗位职责范本
2014/02/11 职场文书
应届中专生自荐书范文
2014/02/13 职场文书
写自荐信的注意事项
2014/03/09 职场文书
软件研发工程师岗位职责
2014/09/30 职场文书