Colors 教程
颜色名称
使用 CSS，可以使用颜色名称设置颜色:
CSS 颜色值
使用 CSS，可以用不同的方式指定颜色:
- 按颜色名称
- 作为 RGB 值
- 作为十六进制值
- 作为 HSL 值 (CSS3)
- 作为 HWB 值 (CSS4)
- 使用
currentcolor关键字
RGB 颜色
所有浏览器都支持 RGB 颜色值。
RGB 颜色值通过以下方式指定: rgb( RED , GREEN , BLUE ).
每个参数将颜色的强度定义为 0 到 255 之间的整数。
例如，rgb(0,0,255) 被渲染为蓝色，因为蓝色参数设置为其最高值 (255)，而其他参数设置为 0。
灰色阴影通常使用所有 3 个光源的相同值来定义:
十六进制颜色
所有浏览器也支持十六进制颜色值。
使用以下命令指定十六进制颜色: #RRGGBB.
RR（红色）、GG（绿色）和 BB（蓝色）是 00 到 FF 之间的十六进制整数，用于指定颜色的强度。
例如，#0000FF 显示为蓝色，因为蓝色分量设置为最高值 (FF)，其他设置为 00。
实例
| 颜色 | 十六进制 | RGB | 颜色 |
|---|---|---|---|
| #FF0000 | rgb(255,0,0) | Red | |
| #00FF00 | rgb(0,255,0) | Green | |
| #0000FF | rgb(0,0,255) | Blue |
灰色阴影通常使用所有 3 个光源的相同值来定义:
实例
| 颜色 | 十六进制 | RGB | 颜色 |
|---|---|---|---|
| #000000 | rgb(0,0,0) | Black | |
| #808080 | rgb(128,128,128) | Gray | |
| #FFFFFF | rgb(255,255,255) | White |
大写还是小写?
您可以使用大写或小写字母来指定十六进制值。
小写更容易写。大写更容易阅读。
颜色名称
CSS 支持 140 种标准颜色名称。
在下一章中，您将找到具有十六进制值的颜色名称的完整字母列表:
| 颜色名称 | 十六进制 | 颜色 |
|---|---|---|
| AliceBlue | #F0F8FF | |
| AntiqueWhite | #FAEBD7 | |
| Aqua | #00FFFF | |
| Aquamarine | #7FFFD4 | |
| Azure | #F0FFFF | |
| Beige | #F5F5DC | |
| Bisque | #FFE4C4 |
currentcolor 当前颜色关键字
currentcolor 关键字是指元素颜色属性的值。
实例
以下 <div> 元素的边框颜色将为蓝色，因为 <div> 元素的文本颜色为蓝色:
#myDIV {
color: blue; /* 蓝色文字颜色 */
border: 10px solid currentcolor;
/* 蓝色边框颜色 */
}
亲自试一试 »
