手机
当前位置:查字典教程网 >网页设计 > Div+Css教程 >CSS中对RGB颜色的使用详解
CSS中对RGB颜色的使用详解
摘要:RGB颜色模型解释RGB颜色模型就是一种描述某个颜色里面有多少红、绿、蓝三原色的量的方法,就像把水彩颜料或油彩颜料混合起来得到某种我们想要的...

RGB颜色模型解释

RGB颜色模型就是一种描述某个颜色里面有多少红、绿、蓝三原色的量的方法,就像把水彩颜料或油彩颜料混合起来得到某种我们想要的真实色彩一样。

想象下如果你要配出一个纯蓝色,为了实现这个,你就不能把红色和绿色放进这个颜色里。所以我们就把红、绿设置为0%,把绿设置为100%:

CSS Code复制内容到剪贴板 rgb(0%,0%,100%)

结果:

但如果你想要的不是蓝色而是紫红色,那该怎么办呢?我们可以通过将100%的红和100%的蓝混合起来得到紫红色:

CSS Code复制内容到剪贴板 rgb(100%,0%,100%)

结果:

从基础的色彩理论,我们知道了没有任何颜色就是黑色。所以为了得到黑色我们可以通过设置红、绿、蓝三原色为0%来实现:

CSS Code复制内容到剪贴板 rgb(0%,0%,0%)

结果:

如何确定RGB颜色的值

我们可以使用Photoshop的拾色器功能来获取特定色彩的红、绿、蓝三原色的数值,但也有免费的网上工具比如Color Slider和The RGB Color Calculator。

w3school上对RGB颜色的解释:

RGB 颜色

所有浏览器都支持 RGB 颜色值。

RGB 颜色值是这样规定的:rgb(red, green, blue)。每个参数 (red、green 以及 blue) 定义颜色的强度,可以是介于 0 与 255 之间的整数,或者是百分比值(从 0% 到 100%)。

举例说,rgb(0,0,255) 值显示为蓝色,这是因为 blue 参数被设置为最高值(255),而其他被设置为 0。

同样地,下面的值定义了相同的颜色:rgb(0,0,255) 和 rgb(0%,0%,100%)。

实例

CSS Code复制内容到剪贴板 p { background-color:rgb(255,0,0); }

【CSS中对RGB颜色的使用详解】相关文章:

对CSS3选择器的研究(详解)

CSS属性behavior的语法使用

CSS中样式覆盖优先顺序详解

CSS中几种常见的注释

CSS样式表中的类

CSS3之边框多颜色Border-color属性使用

清除浮动clear:both的应用详解

DIV+CSS常见的错误

CSS定义标题的实例讲解

CSS font用法定义详解

精品推荐
分类导航