css颜色
CSS 数据类型color表示一种标准RGB色彩空间,一个颜色可以包括一个alpha通道，来表明颜色如何与它的背景色混合
表示方式
- 使用一个关键字
- 使用RGB立体坐标系统（以“#”加十六进制或者rgb 和rgba函数表达式的形式）
- 使用HSL圆柱坐标系统（以hsl和hsla函数表达式的形式）
颜色关键字
是不区分大小写的标识符，它表示一个具体的颜色
transparent 关键字表示一个完全透明的颜色，即该颜色看上去将是背景色。从技术上说，它是带有阿尔法通道为最小值的黑色，是 rgba0,0,0,0 的简写
颜色关键色枚举 css1 16种css2 1种
| 颜色关键字 | 中文名 | 颜色值 | css版本 |
|---|---|---|---|
| black | 黑色 | rgb 0, 0, 0 | css1 |
| silver | 银白色 | rgb 192, 192, 129 | css1 |
| gray | 灰色 | rgb 128, 128, 128 | css1 |
| white | 白色 | rgb 255, 255, 255 | css1 |
| maroon | 褐红色 | rgb 128, 0, 0 | css1 |
| red | 红色 | rgb 255, 0, 0 | css1 |
| purple | 紫色 | rgb 128, 0, 128 | css1 |
| fuchsia | 紫红色 | rgb255, 0, 255 | css1 |
| green | 绿色 | rgb 0, 128, 0 | css1 |
| lime | 石灰色 | rgb 0, 255, 0 | css1 |
| olive | 橄榄色 | rgb 128, 128, 0 | css1 |
| yellow | 黄色 | rgb 255, 255, 0 | css1 |
| navy | 深蓝色 | rgb 0, 0, 128 | css1 |
| blue | 蓝色 | rgb 0, 0, 255 | css1 |
| teal | 蓝绿色 | rgb 0, 128, 128 | css1 |
| aqua | 浅绿色 | rgb 0, 255, 255 | css1 |
| orange | 橙色 | rgb 255, 165, 0 | css2 |
| aliceblue | 爱丽丝蓝 | rgb240, 248, 245 | css3 |
| antiquewhite | 古董白 | rgb250, 235, 215 | css3 |
| aquamarine | 碧绿色 | rgb127, 255, 212 | css3 |
| azure | 天蓝色 | rgb240, 255, 255 | css3 |
| beige | 淡棕色 | rgb245, 245, 220 | css3 |
| bisque | 橘黄色 | rgb255, 228, 196 | css3 |
| blanchedalmond | 白杏色 | rgb255, 235, 205 | css3 |
| blueviolet | 蓝紫色 | rgb138, 43, 226 | css3 |
| brown | 褐色 | rgb165, 42, 42 | css3 |
| burlywood | 实木色 | rgb222, 184, 35 | css3 |
| cadetblue | 军蓝色 | rgb 95, 158, 160 | css3 |
| chartreuse | 黄绿色 | rgb127, 255, 0 | css3 |
| chocolate | 深褐色 | rgb210, 105, 30 | css3 |
| coral | 橘红色 | rgb255, 127, 80 | css3 |
| cornflowerblue | 浅蓝色 | rgb100, 149, 237 | css3 |
| cornsilk | 玉米色 | rgb255, 248, 220 | css3 |
| crimson | 深红色 | rgb220, 20, 60 | css3 |
| darkblue | 深蓝色 | rgb 0, 0, 139 | css3 |
| darkcyan | 深青色 | rgb 0, 139, 139 | css3 |
| darkgoldenrod | 暗金黄 | rgb184, 134, 11 | css3 |
| darkgray | 深灰色 | rgb169, 169, 169 | css3 |
| darkgreen | 深绿色 | rgb 0, 100, 0 | css3 |
| darkkhaki | 暗卡其色 | rgb189, 183, 107 | css3 |
| darkmagenta | 暗洋红色 | rgb139, 0, 139 | css3 |
| darkolivegreen | 暗橄榄绿色 | rgb 85, 107, 47 | css3 |
| darkorange | 暗橙色 | rgb255, 140, 0 | css3 |
| darkorchid | 暗紫色 | rgb153, 50, 204 | css3 |
| darkred | 暗红色 | rgb139, 0, 0 | css3 |
| darksalmon | 暗橙红色 | rgb233, 150, 122 | css3 |
| darkseagreen | 深绿色 | rgb143, 188, 143 | css3 |
| darkslateblue | 暗灰蓝色 | rgb 72, 61, 139 | css3 |
| darkslategray | 墨绿色 | rgb 47, 79, 79 | css3 |
| darkturquoise | -- | rgb 0, 206, 209 | css3 |
| darkviolet | -- | rgb148, 0, 211 | css3 |
| deeppink | -- | rgb255, 20, 147 | css3 |
| deepskyblue | -- | rgb 0, 191, 255 | css3 |
| dimgray | -- | rgb105, 105, 105 | css3 |
| dimgrey | -- | rgb105, 105, 105 | css3 |
| dodgerblue | -- | rgb 30, 144, 255 | css3 |
| firebrick | -- | rgb178, 34, 34 | css3 |
| floralwhite | -- | rgb255, 250, 240 | css3 |
| forestgreen | -- | rgb 34, 139, 34 | css3 |
| gainsboro | -- | rgb220, 220, 220 | css3 |
| ghostwhite | -- | rgb248, 248, 255 | css3 |
| gold | -- | rgb255, 215, 0 | css3 |
| goldenrod | -- | rgb218, 165, 32 | css3 |
| greenyellow | -- | rgb173, 255, 47 | css3 |
| grey | -- | rgb128, 128, 128 | css3 |
| honeydew | -- | rgb240, 255, 240 | css3 |
| hotpink | -- | rgb255, 105, 180 | css3 |
| indianred | -- | rgb205, 92, 92 | css3 |
| indigo | -- | rgb 75, 0, 130 | css3 |
| ivory | -- | rgb255, 255, 240 | css3 |
| khaki | -- | rgb240, 230, 140 | css3 |
| lavender | -- | rgb230, 230, 250 | css3 |
| lavenderblush | -- | rgb255, 240, 245 | css3 |
| lawngreen | -- | rgb124, 252, 0 | css3 |
| lemonchiffon | -- | rgb255, 250, 205 | css3 |
| lightblue | -- | rgb173, 216, 230 | css3 |
| lightcoral | -- | rgb240, 128, 128 | css3 |
| lightcyan | -- | rgb224, 255, 255 | css3 |
| lightgoldenrodyellow | -- | rgb250, 250, 210 | css3 |
| lightgray | -- | rgb211, 211, 211 | css3 |
| lightgreen | -- | rgb144, 238, 144 | css3 |
| lightgrey | -- | rgb211, 211, 211 | css3 |
| lightpink | -- | rgb255, 182, 193 | css3 |
| lightsalmon | -- | rgb255, 160, 122 | css3 |
| lightseagreen | -- | rgb 32, 178, 170 | css3 |
| lightskyblue | -- | rgb135, 206, 250 | css3 |
| lightslategray | -- | rgb119, 136, 153 | css3 |
| lightslategrey | -- | rgb119, 136, 153 | css3 |
| lightsteelblue | -- | rgb176, 196, 222 | css3 |
| lightyellow | -- | rgb255, 255, 224 | css3 |
| limegreen | -- | rgb 50, 205, 50 | css3 |
| linen | -- | rgb250, 240, 230 | css3 |
| mediumaquamarine | -- | rgb102, 205, 170 | css3 |
| mediumblue | -- | rgb 0, 0, 205 | css3 |
| mediumorchid | -- | rgb186, 85, 211 | css3 |
| mediumpurple | -- | rgb147, 112, 219 | css3 |
| mediumseagreen | -- | rgb 60, 179, 113 | css3 |
| mediumslateblue | -- | rgb123, 104, 238 | css3 |
| mediumspringgreen | -- | rgb 0, 250, 154 | css3 |
| mediumturquoise | -- | rgb 72, 209, 204 | css3 |
| mediumvioletred | -- | rgb199, 21, 133 | css3 |
| midnightblue | -- | rgb 25, 25, 112 | css3 |
| mintcream | -- | rgb245, 255, 250 | css3 |
| mistyrose | -- | rgb255, 228, 225 | css3 |
| moccasin | -- | rgb255, 228, 181 | css3 |
| navajowhite | -- | rgb255, 222, 173 | css3 |
| oldlace | -- | rgb253, 245, 230 | css3 |
| olivedrab | -- | rgb107, 142, 35 | css3 |
| orangered | -- | rgb255, 69, 0 | css3 |
| orchid | -- | rgb218, 112, 214 | css3 |
| palegoldenrod | -- | rgb238, 232, 170 | css3 |
| palegreen | -- | rgb152, 251, 152 | css3 |
| paleturquoise | -- | rgb175, 238, 238 | css3 |
| palevioletred | -- | rgb219, 112, 147 | css3 |
| papayawhip | -- | rgb255, 239, 213 | css3 |
| peachpuff | -- | rgb255, 218, 185 | css3 |
| peru | -- | rgb205, 133, 63 | css3 |
| pink | -- | rgb255, 192, 203 | css3 |
| plum | -- | rgb221, 160, 221 | css3 |
| powderblue | -- | rgb176, 224, 230 | css3 |
| rosybrown | -- | rgb188, 143, 143 | css3 |
| royalblue | -- | rgb 65, 105, 225 | css3 |
| saddlebrown | -- | rgb139, 69, 19 | css3 |
| salmon | -- | rgb250, 128, 114 | css3 |
| sandybrown | -- | rgb244, 164, 96 | css3 |
| seagreen | -- | rgb 46, 139, 87 | css3 |
| seashell | -- | rgb255, 245, 238 | css3 |
| sienna | -- | rgb160, 82, 45 | css3 |
| skyblue | -- | rgb135, 206, 235 | css3 |
| slateblue | -- | rgb106, 90, 205 | css3 |
| slategray | -- | rgb112, 128, 144 | css3 |
| slategrey | -- | rgb112, 128, 144 | css3 |
| snow | -- | rgb255, 250, 250 | css3 |
| springgreen | -- | rgb 0, 255, 127 | css3 |
| steelblue | -- | rgb 70, 130, 180 | css3 |
| tan | -- | rgb210, 180, 140 | css3 |
| thistle | -- | rgb216, 191, 216 | css3 |
| tomato | -- | rgb255, 99, 71 | css3 |
| turquoise | -- | rgb 64, 224, 208 | css3 |
| violet | 紫罗兰色 | rgb238, 130, 238 | css3 |
| wheat | 小麦色 | rgb245, 222, 179 | css3 |
| whitesmoke | 烟白色 | rgb245, 245, 245 | css3 |
| yellowgreen | 黄绿色 | rgb154, 205, 50 | css3 |
RGB立体坐标系统
可以使用红 - 绿 - 蓝（red-green-blue RGB）模式定义
- 十六进制符号：#RRGGBB[AA]
- 十六进制符号：#RGB[A]
- 函数符：rgb[a]R, G, B[, A]
- 函数符：rgb[a]R G B[ / A]
HSL圆柱坐标系统
可以使用色相-饱和度-亮度（Hue-saturation-lightness）模式定义
- 函数符：hsl[a]H, S, L[, A]
- 函数符：hsl[a]H S L[ / A]