1. 前言
世界是五彩缤纷的，不论是皑皑的白雪、还是飘落的秋叶，世界因色彩而绚丽。
同样，网页也因为合理搭配色彩，而美观。
之前我们已经学习过设置文本的颜色，设置背景色，以及设置边框的颜色。
颜色的取值都是：red、blue、green等代表颜色的单词。
但是，代表颜色的单词是十分有限的，而世界上的色彩千千万万，我们该如何使用CSS来代表特定的颜色值呢？
2. 三原色
实际上，在光学中，红、绿、蓝三种颜色被称为三原色，也就是说这三种光学颜色混合后，可以产生各种各样的颜色。
基于三原色的原理，我们也可以通过设置红、绿、蓝颜色的比例，来确定一个特定的颜色。
3. RGB颜色值
我们可以通过RGB，R代表红色，G代表绿色，B代表蓝色，来确定颜色值。每种颜色取值范围是0-255,0就表示这种颜色没啥影响力，而255表示把这种颜色用到最大力量了。
形如：
<head> <meta charset="utf-8"> <style> .rgb-black { color: rgb(255, 0, 0); } .rgb-green { color: rgb(0, 255, 0); } .rgb-mix { color: rgb(120, 200, 0); } </style> </head> <body> <div class="rgb-black"> rgb(0, 0, 0)的颜色 </div> <div class="rgb-green"> rgb(0, 255, 0)的颜色 </div> <div class="rgb-mix"> rgb(120, 200, 0)的颜色 </div> </body>
在上面的例子中，rgb-black是红色部分255，绿色蓝色部分0，所以红色是最大值，绿色蓝色的部分则一点没有所以呈现红色。
rgb-green的是绿色部分是最大值，红蓝没有，所以呈现绿色。
rgb-mix，红色120比较小，而绿色200比较多，所以呈现一种绿色较多红色有一点影响的整体效果。
最终效果如下：
4. 16进制颜色值
上面我们讲了，每种颜色取值是0-255，正好可以用一个两位的16进制数表示，所以用一个六位的16进制数，就能表达红、黄、篮三种颜色的取值。
例如：
<div class="hex-red"> #FF0000的颜色 </div> CSS代码： .hex-red{ color: #FF0000; } 颜色取值为#FF0000，其中#表示这是16进制颜色值，FF代表红色，00代表黄色，00代表蓝色。FF对应的10进制数即为255，所以呈现为红色。 16进制数如果大家不理解的话，也没关系，大家只要注意这种写法#000000，代表一种颜色就行了。 5. 取色 我们知道颜色值是如何表示了，但是我们也没法看到一种好看的颜色，就知道它的颜色值。 如果我们想要模仿一个网站中的好看的颜色，我们可以借助取色工具，例如TakeColor，取色效果如下：
这种软件，可以显示我们选中的颜色对应的颜色值，我们拿到颜色值后，就可以在网页中使用该颜色了。
6. 小结
CSS支持三种设置颜色值的方式：
- 直接使用英文单词代表的颜色
- 使用RGB表示颜色值
- 使用16进制表示颜色值
