这篇文章需要文法复核。如何帮忙。
这篇翻译不完整。请帮忙从英语翻译这篇文章。
概述
CSS 数据类型 <color> 表示一种标准RGB色彩空间（sRGB color space）的颜色。一种颜色可以用以下任意的方式来描述：
- 使用一个关键字
- 使用RGB立体坐标（RGB cubic-coordinate）系统（以“#”加十六进制或者
rgb()和rgba()函数表达式的形式） - 使用HSL圆柱坐标（HSL cylindrical-coordinate）系统（以
hsl()和hsla()函数表达式的形式）
注意，以最新的 CSS3 颜色为准，公认颜色值列表已增加到成形的规范中。
一个与 sRGB 空间中色彩相关联的 <color> 值也有一个阿尔法通道（alpha-channel）坐标，即透明度值，来标明颜色如何与它的背景色混合（composite）。
尽管 CSS 颜色值被精确定义，但在不同的输出设备上仍然有可能显示不一。它们大多数是不可被校准的，而且有些浏览器不支持输出设备的色彩配置（color profile）。除此之外，颜色渲染可以丰富多彩。
注意： W3C 的 WCAG 2.0（网页内容可访问性准则 2.0）介绍文档中强烈建议网页制作人员不要使用颜色作为唯一的方式去传达某个具体的信息，行为或结果。一些用户在分辨颜色上存在问题从而所传达的信息可能不被理解。当然，这并不是要阻止颜色的使用，只有在使用颜色作为唯一的方式去描述一些信息时才应当避免。
窜改
CSS 数据类型 <color> 的值可以被窜改以便表演动画或创建 <gradient> （渐变）值。在那种情况下，它们基于红，绿，蓝各部分来窜改，各自用一个浮点实数来控制。注意，颜色的窜改发生在预乘阿尔法值的标准RGB色彩空间（alpha-premultiplied sRGBA color space）以防止显示意外的灰色调。在动画中，窜改的速率由动画相关的时间函数（timing function）来决定。
取值
这里有几种方式来描述一个 <color> 值。
色彩关键字
色彩关键字是不区分大小写的标识符，它表示一个具体的颜色，例如 red, blue, brown, lightseagreen 。使用名称来表述颜色，尽管（颜色的）名称基本上是人工（命名）的。可接受值的列表经由不同的规范而变化了许多：
- CSS 标准 1 只接受 16 个基本颜色，因它们来源于 VGA 显卡所显示的颜色集合而被称为 VGA colors （视频图形阵列色彩）。
- CSS 标准 2 增加了
orange关键字。 - 从一开始，浏览器接受其它的颜色，由于一些早期浏览器是 X11 应用程序，这些颜色大多数是 X11 命名的颜色列表，虽然有一点不同。SVG 1.0 是首个正式定义这些关键字的标准；CSS 色彩标准 3 也正式定义了这些关键字。它们经常被称作扩张的颜色关键字， X11 颜色或 SVG 颜色 。
在使用关键字时有几个需要留意的注意事项：
- 除了通常的 16 个 HTML 基本颜色，其它的不能被用于 HTML 。HTML 将通过一个特定的计算程序转换这些未知的值，这将导致成为完全不同的颜色。这些关键字应只被用于 SVG 和 CSS 。
- 未知的关键字会让 CSS 属性无效。无效的属性将被忽略，该颜色将没有作用。这是一个和 HTML 相比不同的行为。
- 未使用关键字定义的颜色在 CSS 中有任意的透明度，它们是单实色。
- 一些关键字表示同样的颜色：
darkgray/darkgreydarkslategray/darkslategreydimgray/dimgreylightgray/lightgreylightslategray/lightslategreygray/greyslategray/slategrey
- 虽然关键字的名称取自常见的 X11 颜色名，然而由于生产商为具体的硬件所做的定制，颜色可能与 X11 系统上相应的颜色有所偏差。
| 规范 | 颜色 | 关键字 | RGB 十六进制数 | 实样 |
|---|---|---|---|---|
| CSS Level 1 | black（黑） |
#000000 |
||
silver（银） |
#c0c0c0 |
|||
gray[*]（灰） |
#808080 |
|||
white（白） |
#ffffff |
|||
maroon（褐） |
#800000 |
|||
red（红） |
#ff0000 |
|||
purple（紫） |
#800080 |
|||
fuchsia（紫红） |
#ff00ff |
|||
green（绿） |
#008000 |
|||
lime（绿黄） |
#00ff00 |
|||
olive（橄榄绿） |
#808000 |
|||
yellow（黄） |
#ffff00 |
|||
navy（藏青） |
#000080 |
|||
blue（蓝） |
#0000ff |
|||
teal（青） |
#008080 |
|||
aqua（水绿） |
#00ffff |
|||
| CSS Level 2 (Revision 1) | orange（橙） |
#ffa500 |
||
| CSS Color Module Level 3 | aliceblue（浅灰蓝） |
#f0f8ff |
||
antiquewhite（古董白） |
#faebd7 |
|||
aquamarine（海蓝） |
#7fffd4 |
|||
azure（蔚蓝） |
#f0ffff |
|||
beige（浅褐） |
#f5f5dc |
|||
bisque（橘黄） |
#ffe4c4 |
|||
blanchedalmond（杏仁白） |
#ffe4c4 |
|||
blueviolet（蓝紫） |
#8a2be2 |
|||
brown（褐） |
#a52a2a |
|||
burlywood（原木色） |
#deb887 |
|||
cadetblue（灰蓝） |
#5f9ea0 |
|||
chartreuse（黄绿） |
#7fff00 |
|||
chocolate（巧克力色） |
#d2691e |
|||
coral（珊瑚红） |
#ff7f50 |
|||
cornflowerblue（矢车菊蓝） |
#6495ed |
|||
cornsilk（玉米穗黄） |
#fff8dc |
|||
crimson（深红） |
#dc143c |
|||
darkblue（深蓝） |
#00008b |
|||
darkcyan（深青） |
#008b8b |
|||
darkgoldenrod（暗金） |
#b8860b |
|||
darkgray[*]（深灰） |
#a9a9a9 |
|||
darkgreen（深绿） |
#006400 |
|||
darkgrey[*]（深灰） |
#a9a9a9 |
|||
darkkhaki（暗黄褐） |
#bdb76b |
|||
darkmagenta（深紫） |
#8b008b |
|||
darkolivegreen（深橄榄绿） |
#556b2f |
|||
darkorange（深橙） |
#ff8c00 |
|||
darkorchid（深兰花紫） |
#9932cc |
|||
darkred（深红） |
#8b0000 |
|||
darksalmon（深橙红） |
#e9967a |
|||
darkseagreen（深海绿） |
#8fbc8f |
|||
darkslateblue（暗灰蓝） |
#483d8b |
|||
darkslategray[*]（墨绿） |
#2f4f4f |
|||
darkslategrey[*]（墨绿） |
#2f4f4f |
|||
darkturquoise（暗宝石绿） |
#00ced1 |
|||
darkviolet（深紫罗兰） |
#9400d3 |
|||
deeppink（深粉红） |
#ff1493 |
|||
deepskyblue（深天蓝） |
#00bfff |
|||
dimgray[*]（暗灰） |
#696969 |
|||
dimgrey[*]（暗灰） |
#696969 |
|||
dodgerblue（遮板蓝） |
#1e90ff |
|||
firebrick（砖红） |
#b22222 |
|||
floralwhite（花白） |
#fffaf0 |
|||
forestgreen（丛林绿） |
#228b22 |
|||
gainsboro（浅灰） |
#dcdcdc |
|||
ghostwhite（幽灵白） |
#f8f8ff |
|||
gold（金） |
#ffd700 |
|||
goldenrod（橘黄） |
#daa520 |
|||
greenyellow（黄绿） |
#adff2f |
|||
grey（灰） |
#808080 |
|||
honeydew（蜜瓜色） |
#f0fff0 |
|||
hotpink（亮粉） |
#ff69b4 |
|||
indianred（印第安红） |
#cd5c5c |
|||
indigo（靛蓝） |
#4b0082 |
|||
ivory（象牙白） |
#fffff0 |
|||
khaki（卡其色） |
#f0e68c |
|||
lavender（淡紫） |
#e6e6fa |
|||
lavenderblush（淡紫红） |
#fff0f5 |
|||
lawngreen（草绿） |
#7cfc00 |
|||
lemonchiffon（粉黄） |
#fffacd |
|||
lightblue（淡蓝） |
#add8e6 |
|||
lightcoral（浅珊瑚色） |
#f08080 |
|||
lightcyan（淡青） |
#e0ffff |
|||
lightgoldenrodyellow（浅金黄） |
#fafad2 |
|||
lightgray[*]（浅灰） |
#d3d3d3 |
|||
lightgreen（浅绿） |
#90ee90 |
|||
lightgrey[*]（浅灰） |
#d3d3d3 |
|||
lightpink（淡粉） |
#ffb6c1 |
|||
lightsalmon（浅肉色） |
#ffa07a |
|||
lightseagreen（浅海绿） |
#20b2aa |
|||
lightskyblue（浅天蓝） |
#87cefa |
|||
lightslategray[*]（浅青灰） |
#778899 |
|||
lightslategrey[*]（浅青灰） |
#778899 |
|||
lightsteelblue（浅钢蓝） |
#b0c4de |
|||
lightyellow（浅黄） |
#ffffe0 |
|||
limegreen（酸橙绿） |
#32cd32 |
|||
linen（亚麻色） |
#faf0e6 |
|||
mediumaquamarine（中绿） |
#66cdaa |
|||
mediumblue（中蓝） |
#0000cd |
|||
mediumorchid（间兰花紫） |
#ba55d3 |
|||
mediumpurple（中紫） |
#9370db |
|||
mediumseagreen（间海绿） |
#3cb371 |
|||
mediumslateblue（中暗蓝） |
#7b68ee |
|||
mediumspringgreen（中春绿） |
#00fa9a |
|||
mediumturquoise（中海湖蓝） |
#48d1cc |
|||
mediumvioletred（中紫罗兰） |
#c71585 |
|||
midnightblue（午夜蓝） |
#191970 |
|||
mintcream（薄荷乳白） |
#f5fffa |
|||
mistyrose（粉玫瑰红） |
#ffe4e1 |
|||
moccasin（鹿皮色） |
#ffe4b5 |
|||
navajowhite（纳瓦白） |
#ffdead |
|||
oldlace（浅米色） |
#fdf5e6 |
|||
olivedrab（橄榄褐） |
#6b8e23 |
|||
orangered（橙红） |
#ff4500 |
|||
orchid（兰花紫） |
#da70d6 |
|||
palegoldenrod（灰菊黄） |
#eee8aa |
|||
palegreen（苍绿） |
#98fb98 |
|||
paleturquoise（苍宝石绿） |
#afeeee |
|||
palevioletred（苍紫罗兰） |
#db7093 |
|||
papayawhip（木瓜色） |
#ffefd5 |
|||
peachpuff（桃色） |
#ffdab9 |
|||
peru（秘鲁色） |
#cd853f |
|||
pink（粉） |
#ffc0cb |
|||
plum（李子色） |
#dda0dd |
|||
powderblue（粉蓝） |
#b0e0e6 |
|||
rosybrown（玫瑰粽） |
#bc8f8f |
|||
royalblue（宝蓝） |
#4169e1 |
|||
saddlebrown（马鞍棕） |
#8b4513 |
|||
salmon（鲑肉色） |
#fa8072 |
|||
sandybrown（沙褐色） |
#f4a460 |
|||
seagreen（海绿） |
#2e8b57 |
|||
seashell（贝壳白） |
#fff5ee |
|||
sienna（赭） |
#a0522d |
|||
skyblue（天蓝） |
#87ceeb |
|||
slateblue（青蓝） |
#6a5acd |
|||
slategray[*]（青灰） |
#708090 |
|||
slategrey[*]（青灰） |
#708090 |
|||
snow（雪白） |
#fffafa |
|||
springgreen（春绿） |
#00ff7f |
|||
steelblue（铁青） |
#4682b4 |
|||
tan（棕褐） |
#d2b48c |
|||
thistle（苍紫） |
#d8bfd8 |
|||
tomato（番茄红） |
#ff6347 |
|||
turquoise（蓝绿） |
#40e0d0 |
|||
violet（紫罗兰色） |
#ee82ee |
|||
wheat（麦色） |
#f5deb3 |
|||
whitesmoke（烟白） |
#f5f5f5 |
|||
yellowgreen（黄绿） |
#9acd32 |
|||
| CSS Color Module Level 4 | rebeccapurple（利百加紫） |
#663399 |
（译者注：颜色译名仅供参考。）
颜色 rebeccapurple 等价于颜色 #639，关于为何引进此颜色的更多信息可在由 Trezy "Honoring a Great Man" 发布的 Codepen 博客上找到。
transparent 关键字
transparent 关键字表示一个完全透明的颜色，即该颜色看上去将是背景色。从技术上说，它是带有阿尔法通道为最小值的黑色，是 rgba(0,0,0,0) 的简写。
过去的注释
随着经由阿尔法通道（alpha channels）透明度的支持，
transparent 关键字在 CSS Level 2 (Revision 1) 中不是一个真实的颜色。它是一个特殊的关键字，可以代替一个普通的 <color> 值用于两个 CSS 属性中： background 和 border。本质上使用它可以覆盖一个继承的单色。随着经由阿尔法通道（alpha channels）透明度的支持，
transparent 在 CSS Colors Level 3 中被重新定义为一个真实的颜色，允许在任何一个需要 <color> 值的地方使用，像 color 属性。[**]currentColor 关键字
currentColor 关键字代表原始的 color 属性的计算值。它允许让继承自属性或子元素的属性颜色属性以默认值不再继承。
它也能用于那些继承了元素的 color 属性计算值的属性，相当于在这些元素上使用 inherit 关键字，如果这些元素有该关键字的话。
实样
该行的颜色（一个填充颜色的 div）应用它继承自父级的 color 属性。
实样 1
<div style="color:darkred"> The color of this text is the same as the one of the line: <div style="background:currentcolor; height:1px"></div> Some more text. </div>
实样 2
<div style="color:blue"> The color of this text is the same as the one of the line: <div style="background:currentcolor; height:1px"></div> Some more text. </div>
rgb()
颜色可以使用红-绿-蓝（red-green-blue (RGB)）模式的两种方式被定义：
- 十六进制符号
#RRGGBB和#RGB -
- "
#" 后跟6位十六进制字符（0-9, A-F）。 - "
#" 后跟3位十六进制字符（0-9, A-F）。
#RGB）和六位数的形式（#RRGGBB）是相等的。
例如，#f03和#ff0033代表同样的颜色。 - "
- 函数符
rgb(R,G,B) - "
rgb" 后跟3个<integer>或3个<percentage>值。
整数 255 相当于 100%，和十六进制符号里的 F 或 FF 。
/* These examples all specify the same RGB color: */ #f03 #F03 #ff0033 #FF0033 rgb(255,0,51) rgb(255, 0, 51)rgb(255, 0, 51.2)/* ERROR! Don't use fractions, use integers */ rgb(100%,0%,20%) rgb(100%, 0%, 20%)rgb(100%, 0, 20%)/* ERROR! Don't mix up integer and percentage notation */
hsl()
颜色也可以使用 hsl() 函数符被定义为色相-饱和度-明度（Hue-saturation-lightness）模式。HSL 相比 RGB 的优点是更加直观：你可以估算你想要的颜色，然后微调。它也更易于创建相称的颜色集合。（通过保持相同的色相并改变明度/暗度和饱和度）。
色相（Hue）表示色环（即代表彩虹的一个圆环）的一个角度。这个角度作为一个无单位的 <number> 被给出。定义 red=0=360，其它颜色分散于圆环，所以 green=120, blue=240，以此类推。作为一个角度，它隐含像 -120=240 和 480=120 这样的回环。
饱和度和明度由百分数来表示。
100% 是满饱和度，而 0% 是一种灰度。
100% 明度是白色， 0% 明度是黑色，而 50% 明度是“一般的”。
hsl(0, 100%,50%) /* red */ hsl(30, 100%,50%) hsl(60, 100%,50%) hsl(90, 100%,50%) hsl(120,100%,50%) /* green */ hsl(150,100%,50%) hsl(180,100%,50%) hsl(210,100%,50%) hsl(240,100%,50%) /* blue */ hsl(270,100%,50%) hsl(300,100%,50%) hsl(330,100%,50%) hsl(360,100%,50%) /* red */ hsl(120,100%,25%) /* dark green */ hsl(120,100%,50%) /* green */ hsl(120,100%,75%) /* light green */ hsl(120,100%,50%) /* green */ hsl(120, 67%,50%) hsl(120, 33%,50%) hsl(120, 0%,50%) hsl(120, 60%,70%) /* pastel green */
rgba()
颜色可以使用 rgba() 函数符在红-绿-蓝-阿尔法（RGBa）模式下被定义。RGBa 扩展了 RGB 颜色模式，它包含了阿尔法通道，允许设定一个颜色的透明度。
a 表示透明度：0=透明；1=不透明；
rgba(255,0,0,0.1) /* 10% opaque red */ rgba(255,0,0,0.4) /* 40% opaque red */ rgba(255,0,0,0.7) /* 70% opaque red */ rgba(255,0,0, 1) /* full opaque red */
hsla()
颜色可以使用 hsla() 函数符在色相-饱和度-明度-阿尔法（HSLa）模式下被定义。HSLa 扩展自 HSL 颜色模式，包含了阿尔法通道，可以规定一个颜色的透明度。
a 表示透明度：0=透明；1=不透明；
hsla(240,100%,50%,0.05) /* 5% opaque blue */ hsla(240,100%,50%, 0.4) /* 40% opaque blue */ hsla(240,100%,50%, 0.7) /* 70% opaque blue */ hsla(240,100%,50%, 1) /* full opaque blue */
系统颜色
并非所有的系统都支持全部的系统颜色。 用于公共的网页。
- ActiveBorder
- Active window border.
- ActiveCaption
- Active window caption. Should be used with CaptionText foreground color.
- AppWorkspace
- Background color of multiple document interface.
- Background
- Desktop background.
- ButtonFace
- Face background color for 3-D elements that appear 3-D due to one layer of surrounding border. Should be used with ButtonText foreground color.
- ButtonHighlight
- The color of the border facing the light source for 3-D elements that appear 3-D due to one layer of surrounding border.
- ButtonShadow
- The color of the border away from the light source for 3-D elements that appear 3-D due to one layer of surrounding border.
- ButtonText
- Text on push buttons. Should be used with ButtonFace or ThreeDFace background color.
- CaptionText
- Text in caption, size box, and scrollbar arrow box. Should be used with ActiveCaption background color.
- GrayText
- Grayed (disabled) text.
- Highlight
- Item(s) selected in a control. Should be used with HighlightText foreground color.
- HighlightText
- Text of item(s) selected in a control. Should be used with Highlight background color.
- InactiveBorder
- Inactive window border.
- InactiveCaption
- Inactive window caption. Should be used with InactiveCaptionText foreground color.
- InactiveCaptionText
- Color of text in an inactive caption. Should be used with InactiveCaption background color.
- InfoBackground
- Background color for tooltip controls. Should be used with InfoText foreground color.
- InfoText
- Text color for tooltip controls. Should be used with InfoBackground background color.
- Menu
- Menu background. Should be used with MenuText or -moz-MenuBarText foreground color.
- MenuText
- Text in menus. Should be used with Menu background color.
- Scrollbar
- Scroll bar gray area.
- ThreeDDarkShadow
- The color of the darker (generally outer) of the two borders away from the light source for 3-D elements that appear 3-D due to two
concentric layers of surrounding border. - ThreeDFace
- The face background color for 3-D elements that appear 3-D due to two concentric layers of surrounding border. Should be used with ButtonText foreground color.
- ThreeDHighlight
- The color of the lighter (generally outer) of the two borders facing the light source for 3-D elements that appear 3-D due to two
concentric layers of surrounding border. - ThreeDLightShadow
- The color of the darker (generally inner) of the two borders facing the light source for 3-D elements that appear 3-D due to two
concentric layers of surrounding border. - ThreeDShadow
- The color of the lighter (generally inner) of the two borders away from the light source for 3-D elements that appear 3-D due to two
concentric layers of surrounding border. - Window
- Window background. Should be used with WindowText foreground color.
- WindowFrame
- Window frame.
- WindowText
- Text in windows. Should be used with Window background color.
Mozilla System Color Extensions
- -moz-ButtonDefault
- The border color that goes around buttons that represent the default action for a dialog box.
- -moz-ButtonHoverFace
- The background color of a button that the mouse pointer is over (which would be ThreeDFace or ButtonFace when the mouse pointer is not over it). Should be used with the -moz-ButtonHoverText foreground color.
- -moz-ButtonHoverText
- The text color of a button that the mouse pointer is over (which would be ButtonText when the mouse pointer is not over it). Should be used with the -moz-ButtonHoverFace background color.
- -moz-CellHighlight
- Background color for selected item in a tree widget. Should be used with -moz-CellHighlightText foreground color. See also -moz-html-CellHighlight.
- -moz-CellHighlightText
- Text color for a selected item in a tree. Should be used with -moz-CellHighlight background color. See also -moz-html-CellHighlightText.
- -moz-Combobox
- Background color for comboboxes. Should be used with -moz-ComboboxText foreground color. In versions prior to 1.9.2, use -moz-Field instead.
- -moz-ComboboxText
- Background Text color for comboboxes. Should be used with -moz-ComboboxText foreground color. In versions prior to 1.9.2, use -moz-FieldText instead.
- -moz-Dialog
- Background color for dialog boxes. Should be used with -moz-DialogText foreground color.
- -moz-DialogText
- Text color for dialog boxes. Should be used with -moz-Dialog background color.
- -moz-dragtargetzone
- -moz-EvenTreeRow
- Background color for even-numbered rows in a tree. Should be used with -moz-FieldText foreground color. In Gecko versions prior to 1.9, use -moz-Field. See also -moz-OddTreeRow.
- -moz-Field
- textfield background color. Should be used with -moz-FieldText foreground color.
- -moz-FieldText
- textfield foreground color. Should be used with -moz-Field, -moz-EvenTreeRow, or -moz-OddTreeRow background colors.
- -moz-html-CellHighlight
- Background color for highlighted item in HTML select. Should be used with -moz-html-CellHighlightText foreground color. Prior to Gecko 1.9, use -moz-CellHighlight.
- -moz-html-CellHighlightText
- Background color for highlighted item in HTML select. Should be used with -moz-html-CellHighlight background color. Prior to Gecko 1.9, use -moz-CellHighlightText.
- -moz-mac-accentdarkestshadow
- -moz-mac-accentdarkshadow
- -moz-mac-accentface
- -moz-mac-accentlightesthighlight
- -moz-mac-accentlightshadow
- -moz-mac-accentregularhighlight
- -moz-mac-accentregularshadow
- -moz-mac-chrome-active
- -moz-mac-chrome-inactive
- -moz-mac-focusring
- -moz-mac-menuselect
- -moz-mac-menushadow
- -moz-mac-menutextselect
- -moz-MenuHover
- Background color for hovered menu item. Often similar to Highlight. Should be used with -moz-MenuHoverText or -moz-MenuBarHoverText foreground color.
- -moz-MenuHoverText
- Foreground color for hovered menu item. Often similar to HighlightText. Should be used with -moz-MenuHover background color.
- -moz-MenuBarText
- Foreground color for text in menu bars. Often similar to MenuText. Should be used on top of Menu background.
- -moz-MenuBarHoverText
- Foreground color for hovered text in menu bars. Often similar to -moz-MenuHoverText. Should be used on top of -moz-MenuHover background.
- -moz-nativehyperlinktext
- default platform hyperlink color
- -moz-OddTreeRow
- Background color for odd-numbered rows in a tree. Should be used with -moz-FieldText foreground color. In Gecko versions prior to 1.9, use -moz-Field. See also -moz-EvenTreeRow.
- -moz-win-communicationstext
- Should be used for text in objects with appearance:-moz-win-communications-toolbox.
- -moz-win-mediatext
- Should be used for text in objects with appearance:-moz-win-media-toolbox.
Mozilla Color Preference Extensions
- -moz-activehyperlinktext
- User's preference for text color of active links. Should be used against default document background.
- -moz-default-background-color
- User's preference for document background-color.
- -moz-default-color
- User's preference for text color.
- -moz-hyperlinktext
- User's preference for text color of unvisited links. Should be used against default document background.
- -moz-visitedhyperlinktext
- User's preference for text color of visited links. Should be used against default document background.
规范
| 规范 | 状态 | 注释 |
|---|---|---|
| CSS Color Module Level 4 <color> |
Editor's Draft | 添加 rebeccapurple. |
| CSS Color Module Level 3 <color> |
Recommendation | 废弃系统颜色；添加 SVG 颜色；添加 rgba(), hsl(), hsla() 函数符。 |
| CSS Level 2 (Revision 1) <color> |
Recommendation | 添加 orange 颜色和系统颜色。 |
| CSS Level 1 <color> |
Recommendation | 初始定义 |
浏览器兼容性
| 特性 | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
|---|---|---|---|---|---|
| 关键字颜色 | 1.0 | 1.0 (1.0) | 3.0 [*] | 3.5 | 1.0 (85) |
#RRGGBB | #RGB |
1.0 | 1.0 (1.0) | 3.0 | 3.5 | 1.0 (85) |
rgb() |
1.0 | 1.0 (1.0) | 4.0 | 3.5 | 1.0 (85) |
hsl() |
1.0 | 1.0 (1.5) | 9.0 | 9.5 | 3.1 (525) |
rgba() |
1.0 | 3.0 (1.9) | 9.0 | 10.0 | 3.1 (525) |
hsla() |
1.0 | 3.0 (1.9) | 9.0 | 10.0 | 3.1 (525) |
currentColor |
1.0 | 1.5 (1.8) | 9.0 | 9.5 | 4.0 (528) |
transparent |
1.0 | 3.0 (1.9) | 9.0 [**] | 10.0 | 3.1 (525) |
rebeccapurple |
38.0 | 33 (33) | 11 | 25.0 | 7.1 |
| 特性 | Android | Firefox Mobile (Gecko) | IE Phone | Opera Mobile | Safari Mobile (WebKit) |
|---|---|---|---|---|---|
| 基础支持 | ? | ? | ? | ? | ? |
| rgba() | ? | ? | ? | ? | 5.1(534.46) (maybe earlier) |
rebeccapurple |
(Yes) | 33.0 (33) | ? | ? | 8 |
[*] The 'e'-grey colors (with an e) (grey, darkgrey, darkslategrey, dimgrey, lightgrey, lightslategrey) are only supported since IE 8.0. IE 3 to IE 6 only support the 'a' variants: gray, darkgray, darkslategray, dimgray, lightgray, lightslategray.
[**] IE 7-8 只对 background 和 border 支持 transparent 关键字。在 IE 下 color:transparent 被绘制成黑色。IE6 渲染透明边框也是黑色。
参见
- The
opacityproperty, allowing to define the transparency of color at the element level. - The
color,background-color,border-color,outline-color,text-shadow,box-shadowproperties. - CSS Reference index