上一个   下一个   目录   属性   索引  

4 语法和基本数据类型

内容

注意：本规范的若干章节已被其他规范更新。请参阅最新 CSS Snapshot 中的 “层叠样式表 (CSS) — 官方定义”，其中列出了规范以及它们取代的章节。

CSS 工作组也在开发 CSS 2 级修订版 2（CSS 2.2）。

4.1 语法

本节描述了一套语法（以及 向前兼容解析 规则），该语法适用于任何层级的 CSS（包括 CSS 2.1）。CSS 的未来版本将遵循此核心语法，尽管它们可能会加入额外的语法约束。

这些描述具有规范性。它们还由 附录 G 中给出的规范语法规则予以补充。

在本规范中，表达“紧接在前面”或“紧接在后面”意味着两者之间不存在空白字符或注释。

4.1.1 标记化

所有层级的 CSS——第 1 级、第 2 级以及任何未来层级——都使用相同的核心语法。这使得用户代理能够解析（虽然不一定完全理解）在其创建时尚不存在的 CSS 层级所编写的样式表。设计者可以利用此特性创建兼容旧用户代理的样式表，同时又能使用最新 CSS 层级的功能。

在词法层面，CSS 样式表由一系列记号（token）组成。CSS 的记号列表如下。定义使用 Lex 风格的正则表达式。八进制代码指 ISO 10646（[ISO10646]）。与 Lex 相同，在出现多个匹配时，最长匹配决定记号。

令牌定义
IDENT{ident}
ATKEYWORD@{ident}
STRING{string}
BAD_STRING{badstring}
BAD_URI{baduri}
BAD_COMMENT{badcomment}
HASH#{name}
NUMBER{num}
PERCENTAGE{num}%
DIMENSION{num}{ident}
URIurl\({w}{string}{w}\)
|url\({w}([!#$%&*-\[\]-~]|{nonascii}|{escape})*{w}\)
UNICODE-RANGEu\+[0-9a-f?]{1,6}(-[0-9a-f]{1,6})?
CDO<!--
CDC-->
: :
; ;
{ \{
} \}
( \(
) \)
[ \[
] \]
S[ \t\r\n\f]+
COMMENT\/\*[^*]*\*+([^/*][^*]*\*+)*\/
FUNCTION{ident}\(
INCLUDES~=
DASHMATCH|=
DELIMany other character not matched by the above rules, and neither a single nor a double quote

上面大括号（{}）中的宏定义如下

Macro（微距）定义
ident[-]?{nmstart}{nmchar}*
name{nmchar}+
nmstart[_a-z]|{nonascii}|{escape}
nonascii[^\0-\237]
unicode\\[0-9a-f]{1,6}(\r\n|[ \n\r\t\f])?
escape{unicode}|\\[^\n\r\f0-9a-f]
nmchar[_a-z0-9-]|{nonascii}|{escape}
编号符号（num）[0-9]+|[0-9]*\.[0-9]+
string{string1}|{string2}
string1\"([^\n\r\f\\"]|\\{nl}|{escape})*\"
string2\'([^\n\r\f\\']|\\{nl}|{escape})*\'
badstring{badstring1}|{badstring2}
badstring1\"([^\n\r\f\\"]|\\{nl}|{escape})*\\?
badstring2\'([^\n\r\f\\']|\\{nl}|{escape})*\\?
badcomment{badcomment1}|{badcomment2}
badcomment1\/\*[^*]*\*+([^/*][^*]*\*+)*
badcomment2\/\*[^*]*(\*+[^/*][^*]*)*
baduri{baduri1}|{baduri2}|{baduri3}
baduri1url\({w}([!#$%&*-~]|{nonascii}|{escape})*{w}
baduri2url\({w}{string}{w}
baduri3url\({w}{badstring}
nl\n|\r\n|\r|\f
w[ \t\r\n\f]*

示例

例如，“red-->” 的最长匹配规则会把它标记为 IDENT “red--” 再加上 DELIM “>”，而不是先得到 IDENT 再得到 CDC。

下面给出 CSS 的核心语法。随后的章节描述了如何使用它。附录 G 描述了一种更严格的语法，接近 CSS 2 语言。能够按照此语法解析但无法按照附录 G 中的语法解析的样式表部分将在 解析错误处理规则 中被忽略。

stylesheet  : [ CDO | CDC | S | statement ]*;
statement   : ruleset | at-rule;
at-rule     : ATKEYWORD S* any* [ block | ';' S* ];
block       : '{' S* [ any | block | ATKEYWORD S* | ';' S* ]* '}' S*;
ruleset     : selector? '{' S* declaration? [ ';' S* declaration? ]* '}' S*;
selector    : any+;
declaration : property S* ':' S* value;
property    : IDENT;
value       : [ any | block | ATKEYWORD S* ]+;
any         : [ IDENT | NUMBER | PERCENTAGE | DIMENSION | STRING
              | DELIM | URI | HASH | UNICODE-RANGE | INCLUDES
              | DASHMATCH | ':' | FUNCTION S* [any|unused]* ')'
              | '(' S* [any|unused]* ')' | '[' S* [any|unused]* ']'
              ] S*;
unused      : block | ATKEYWORD S* | ';' S* | CDO S* | CDC S*;

“unused” 产生式在 CSS 中未使用，未来的任何扩展也不会使用它。此处仅将其列出以帮助错误处理。（参见 4.2 “解析错误处理规则”。）

COMMENT 记号不出现在文法中（为保持可读性），但任意数量的此类记号可以出现在其他记号之外的任意位置。（请注意，@charset 规则之前或内部的注释会导致 @charset 失效。）

上面文法中的记号 S 代表 空白字符。仅有 “空格” (U+0020)、“制表符” (U+0009)、“换行” (U+000A)、“回车” (U+000D) 与 “换页” (U+000C) 可以出现在空白字符中。其它类似空格的字符，例如 “全角空格” (U+2003) 与 “汉字空格” (U+3000)，永不构成空白字符。

在 CSS 2.1 中，无法被标记化或解析的输入其含义未定义。

4.1.2 关键字

关键字的形式为 标识符。关键字不得放在引号（“...” 或 ‘...’）之中。因此，

red

是关键字，但

"red"

则不是。（它是一个 字符串。）其他非法示例

非法示例


width: "auto";
border: "none";
background: "red";

4.1.2.1 供应商特定扩展

在 CSS 中，标识符可以以 ‘-’（连字符）或 ‘_’（下划线）开头。以 - 或 _ 开头的关键字和 属性名 被保留用于供应商特定扩展。这类扩展应采用以下形式之一：

'-' + vendor identifier + '-' + meaningful name
'_' + vendor identifier + '-' + meaningful name

示例

例如，若 XYZ 组织想为显示器东侧的边框颜色添加属性，可能会命名为 -xyz-border-east-color。

其它已知示例

-moz-box-sizing
-moz-border-radius
-wap-accesskey

初始的连字符或下划线保证在任何当前或未来的 CSS 层级中都不会用于属性或关键字。因此，典型的 CSS 实现可能不识别此类属性并按 解析错误处理规则 忽略它们。然而，由于初始连字符或下划线是文法的一部分，CSS 2.1 的实现者应始终能够使用符合 CSS 的解析器，无论其是否支持任何供应商特定扩展。

作者应避免使用供应商特定扩展

4.1.2.2 信息性历史注记

本节是资料性的。

截至撰写时，已知存在以下前缀：

prefixorganization
-ms-, mso-Microsoft
-moz-Mozilla
-o-, -xv-Opera Software
-atsc-高级电视标准委员会
-wap-WAP 论坛
-khtml-KDE
-webkit-Apple
prince-YesLogic
-ah-Antenna House
-hp-惠普公司
-ro-Real Objects
-rim-Research In Motion
-tc-TallComponents

4.1.3 字符与大小写

以下规则始终成立：

4.1.4 语句

任何层级的 CSS 样式表都由一系列 语句（参见上面的 文法）构成。语句有两类：At-rule 与 规则集。语句前后可以出现 空白字符。

4.1.5 At-rule

At-rule 以 at-关键字 开头，即以 ‘@’ 紧跟一个 标识符（例如 ‘@import’，‘@page’）。

一个 at-rule 包含从开头一直到（并包括）下一个分号 (;) 或下一个 块（两者中先出现的那个）。

CSS 2.1 用户代理必须 忽略 任意出现在 块 内部或在除 @charset 与 @import 之外的非忽略语句之后的 ‘@import’ 规则。

非法示例

例如，假设 CSS 2.1 解析器遇到如下样式表：


@import "subs.css";
h1 { color: blue }
@import "list.css";

第二个 ‘@import’ 根据 CSS 2.1 是非法的。CSS 2.1 解析器 忽略 整个 at-rule，等效于将样式表简化为：


@import "subs.css";
h1 { color: blue }

非法示例

在下面的例子中，第二个 ‘@import’ 规则无效，因为它位于 ‘@media’ 块 内部。


@import "subs.css";
@media print {
  @import "print-main.css";
  body { font-size: 10pt }
}
h1 {color: blue }

如果只想在 ‘print’ 媒体下导入样式表，应使用带媒体语法的 @import，如：


@import "subs.css";
@import "print-main.css" print;
@media print {
  body { font-size: 10pt }
}
h1 {color: blue }

4.1.6 块

一个 块 以左花括号 ({) 开始，以匹配的右花括号 (}) 结束。两者之间可以出现任意记号，但圆括号 (( )), 方括号 ([ ]) 与花括号 ({ }) 必须始终成对出现且可以嵌套。单引号 (') 与双引号 (") 也必须成对出现，引号之间的字符被解析为 字符串。有关字符串的定义，请参阅上面的 标记化。

非法示例

下面是块的一个示例。请注意，双引号内的右花括号并不匹配块的左花括号，第二个单引号是 转义字符，因此它不与第一个单引号匹配。


{ causta: "}" + ({7} * '\'') }

请注意，上述规则并不是合法的 CSS 2.1，但它仍然是上述定义的块。

4.1.7 规则集、声明块与选择器

规则集（亦称 “规则”）由选择器后跟一个声明块组成。

一个 声明块 以左花括号 ({) 开始，以匹配的右花括号 (}) 结束。两者之间必须是零个或多个用分号 (;) 分隔的 声明。

该 选择器（另请参见 选择器 章节）包含直到（但不包括）第一个左花括号 ({) 为止的所有内容。选择器始终与声明块配对。当用户代理无法解析选择器（即它不是合法的 CSS 2.1）时，必须 忽略 该选择器以及紧随其后的声明块（若有的话）。

CSS 2.1 为选择器中的逗号 (,) 赋予了特殊含义。然而，由于未来的 CSS 更新可能会为逗号赋予其他含义，若选择器任意位置出现错误，即使选择器的其余部分在 CSS 2.1 看起来合理，也应 忽略 整个语句。

非法示例

例如，因为 “&” 不是合法的 CSS 2.1 选择器记号，CSS 2.1 用户代理必须 忽略 整个第二行，而不是把 H3 的颜色设为红色。


h1, h2 {color: green }
h3, h4 & h5 {color: red }
h6 {color: black }

示例

下面是更复杂的示例。前两个花括号对位于字符串内部，因此不标记选择器的结束。这是合法的 CSS 2.1 规则。


p[example="public class foo\
{\
    private int x;\
\
    foo(int x) {\
        this.x = x;\
    }\
\
}"] { color: red }

4.1.8 声明 与 属性

一个 声明 可以为空，也可以由 属性名、冒号 (:) 与属性值三部分构成。每一部分前后均可出现 空白字符。

由于选择器的工作方式，相同选择器的多条声明可以组织为用分号 (;) 分隔的组。

示例

于是，下面的规则


h1 { font-weight: bold }
h1 { font-size: 12px }
h1 { line-height: 14px }
h1 { font-family: Helvetica }
h1 { font-variant: normal }
h1 { font-style: normal }

等价于


h1 {
  font-weight: bold;
  font-size: 12px;
  line-height: 14px;
  font-family: Helvetica;
  font-variant: normal;
  font-style: normal
}

属性名是 标识符。属性值中可以出现任意记号。圆括号 (“( )”)、方括号 (“[ ]”)、花括号 (“{ }”)、单引号 (') 与双引号 (") 必须成对出现，且位于字符串外的分号必须 转义。圆括号、方括号与花括号可以嵌套。引号内部的字符被解析为字符串。

属性 值 的语法对每个属性单独规定，但无论如何，值均由标识符、字符串、数字、长度、百分比、URI、颜色等构成。

用户代理必须 忽略 具有非法属性名或非法值的声明。每个 CSS 属性都有其自身对合法值的语法与语义限制。

非法示例

例如，假设 CSS 2.1 解析器遇到如下样式表：


h1 { color: red; font-style: 12pt }  /* Invalid value: 12pt */
p { color: blue;  font-vendor: any;  /* Invalid prop.: font-vendor */
    font-variant: small-caps }
em em { font-style: normal }

第一行的第二条声明的值 ‘12pt’ 非法。第二行的第二条声明使用了未定义的属性 ‘font-vendor’。CSS 2.1 解析器将 忽略 这些声明，从而等效于：


h1 { color: red; }
p { color: blue;  font-variant: small-caps }
em em { font-style: normal }

4.1.9 注释

注释 以字符 “/*” 开始，以字符 “*/” 结束。它们可以出现在其他记号之外的任意位置，且其内容对渲染没有影响。注释不能嵌套。

CSS 还允许在文法规定的特定位置使用 SGML 注释分隔符 (“<!--” 与 “-->”)，但它们并不界定 CSS 注释。之所以允许，是为了在 HTML 源文档（STYLE 元素内部）的样式规则能够对早期的 HTML 3.2 用户代理隐藏。更多信息请参见 HTML 4 规范（[HTML4]）。

4.2 处理解析错误的规则

在某些情况下，用户代理必须忽略非法样式表的部分。本规范将 忽略 定义为：用户代理解析非法部分（以确定其起止），但随后表现得好像该部分根本不存在。CSS 2.1 为未来的 CSS 更新保留了所有不包含以连字符或下划线开头标识符的 property:value 组合以及 @-关键字。实现必须忽略这些组合（除非它们由未来的 CSS 更新引入）。

为保证未来能够添加新属性及现有属性的新取值，用户代理在遇到以下情形时必须遵守相应规则：

4.3 取值

4.3.1 整数与实数

某些取值类型可能为整数（用 <integer> 表示）或实数（用 <number> 表示）。实数与整数仅使用十进制表示。<<integer> 由一个或多个数字 “0” 到 “9” 组成。<<number> 可以是一个 <integer>，也可以是零个或多个数字后跟句点 (.) 再后接一个或多个数字。整数和实数均可带前缀 “-” 或 “+” 表示符号。-0 等价于 0，且不视为负数。

请注意，许多接受整数或实数的属性实际上会把取值限制在某个范围内，通常是非负值。

4.3.2 长度

长度指代距离测量。

长度值（在本规范中用 <length> 表示）的格式为一个 <number>（可以带或不带小数点），紧接一个单位标识符（如 px、em 等）。在零长度时，单位标识符是可选的。

某些属性允许负长度值，但这可能会使格式模型复杂化，并且可能受到实现的限制。如果无法支持负长度值，应将其转换为最近的可支持值。

如果在不允许负长度值的属性上设置了负长度，该声明将被忽略。

在无法支持所 使用 的长度时，用户代理必须在 实际值 中对其进行近似。

长度单位分为两类：相对单位和绝对单位。 相对长度 单位基于另一个长度属性定义。使用相对单位的样式表更易在不同输出环境之间进行伸缩。

相对单位包括：

示例


h1 { margin: 0.5em }      /* em */
h1 { margin: 1ex }        /* ex */

'em' 单位等于使用该单位的元素 font-size 的计算值。唯一例外是当 ‘em’ 出现在 ‘font-size’ 属性本身的取值中，此时它指向父元素的字体大小。它可用于垂直或水平测量。（在排版文献中该单位亦常被称为 “quad‑width”。）

'ex' 单位由元素的首个可用字体定义。例外情况是当 ‘ex’ 出现在 font-size 属性值中，此时它指向父元素的 ‘ex’。

'x-height' 通常等同于小写字母 “x” 的高度。但即使字体中不含 “x”，仍然会为 ‘ex’ 定义一个值。

获取字体的 x-height 有多种方法。有些字体提供可靠的 x-height 度量。如果没有可靠的度量，UA 可以通过小写字形的高度来估算。常用的启发式做法是观察小写字母 “o” 在基线以下伸出的程度，并从其包围盒顶部减去该值。在无法确定或不切实际的情况下，应使用 0.5em 作为默认值。

示例

该规则


h1 { line-height: 1.2em }

这意味着 “h1” 元素的行高将比其字体大小大 20%。另一方面，


h1 { font-size: 1.2em }

则意味着 “h1” 元素的字体大小比其继承的字体大小大 20%。

当在 文档树根（例如 HTML 中的 “HTML”）上指定时，‘em’ 与 ‘ex’ 指向属性的 初始值。

子元素不会继承父元素指定的相对值；它们继承的是 计算值。

示例

在下面的规则中，如果 “h1” 是 “body” 的子元素，则其计算后的 text‑indent 为 36px，而不是 45px。


body {
  font-size: 12px;
  text-indent: 3em;  /* i.e., 36px */
}
h1 { font-size: 15px }

绝对长度 单位之间固定不变，主要在已知输出环境时使用。绝对单位包括物理单位（in、cm、mm、pt、pc）以及 px 单位。

对于 CSS 设备，这些尺寸的基准可以是 (i) 将物理单位与其实际测量关联，或 (ii) 将像素单位关联到 参考像素。对于打印介质及类似的高分辨率设备，基准单位应选用标准物理单位（英寸、厘米等）。对于低分辨率设备以及观看距离异常的设备，建议使用像素单位作为基准。对这些设备，像素单位应指代最能逼近参考像素的整数个设备像素。

请注意，如果基准单位是像素单位，则物理单位可能并不对应其实际测量；相反，如果基准单位是物理单位，则像素单位可能无法映射为整数个设备像素。

需要指出的是，此处对像素单位与物理单位的定义已与早期 CSS 版本不同。特别是在早期版本中，像素单位与物理单位之间并不存在固定比例：物理单位始终对应其实际测量，而像素单位会随设备而变化，以最接近参考像素。之所以改变，是因为大量现有内容依赖于 96 dpi 的假设，打破该假设会导致内容失效。

参考像素 是指在密度为 96 dpi、阅读距离约为手臂长度的设备上，一个像素所对应的视觉角度。以典型手臂长度 28 英寸计，其视觉角约为 0.0213°。在手臂长度的阅读距离下，1 px 大约等于 0.26 mm（1/96 英寸）。

下图说明了观看距离对参考像素大小的影响：71 厘米（28 英寸）的阅读距离导致参考像素为 0.26 毫米，而 3.5 米（12 英尺）的阅读距离导致参考像素为 1.3 毫米。

Showing that pixels must become larger if the viewing distance increases   [D]

第二幅图示例说明了设备分辨率对像素单位的影响：在低分辨率设备（如普通电脑显示器）上，1 px × 1 px 的面积只被一个点覆盖；而在高分辨率设备（如打印机）上，同样的面积会被 16 个点覆盖。

Showing that more device pixels (dots) are needed to cover a 1px by 1px area on a high-resolution device than on a low-res one   [D]

示例


h1 { margin: 0.5in }      /* inches  */
h2 { line-height: 3cm }   /* centimeters */
h3 { word-spacing: 4mm }  /* millimeters */
h4 { font-size: 12pt }    /* points */
h4 { font-size: 1pc }     /* picas */
p  { font-size: 12px }    /* px */

4.3.3 百分比

百分比值（在本规范中用 <percentage> 表示）的格式为一个 <number>，紧跟字符 ‘%’。

百分比值始终相对于另一个值（例如长度）。每个允许百分比的属性都定义了百分比所对应的基准值。该基准值可以是同一元素的另一属性值、祖先元素的属性值，或格式化上下文的值（例如 包含块 的宽度）。当在 根 元素上设置百分比且该百分比被定义为相对于某属性的继承值时，其结果值为该属性的 初始值 的该百分比倍。

示例

由于子元素通常会继承父元素的 计算值，在下面的例子中，P 元素的子元素会继承 line‑height 为 12px，而不是百分比值 (120%)。


p { font-size: 10px }
p { line-height: 120% }  /* 120% of 'font-size' */

4.3.4 URL 与 URI

本规范中用 <uri> 表示 URI（统一资源标识符，参见 [RFC3986]，包括 URL、URN 等）。在属性值中使用 URI 的函数记法为 “url()”，例如：

示例


body { background: url("http://www.example.com/pinkish.png") }

URI 值的格式为 ‘url(’ 后可选 空白字符，再可选单引号 (') 或双引号 (")，接 URI 本身，再可选单引号或双引号，随后可选空白字符，最后是 ‘)’。两个引号字符必须相同。

示例

不使用引号的示例


li { list-style: url(http://www.example.com/redball.png) disc }

在未加引号的 URI 中出现的某些字符（如圆括号、空白字符、单引号 (') 与双引号 (")）必须使用反斜杠转义，以形成合法的 URI 记号：‘\(’，‘\)’。

根据 URI 类型，也可以使用 URI‑转义形式（例如 “(” = %28， “)” = %29，等等），如 [RFC3986] 所述。

请注意，COMMENT 记号不能出现在其他记号内部：因此，“url(/*x*/pic.png)” 表示的 URI 为 “/*x*/pic.png”，而不是 “pic.png”。

为创建不依赖资源绝对位置的模块化样式表，作者可以使用相对 URI。相对 URI（如 [RFC3986] 中定义）通过基准 URI 解析为完整 URI。RFC 3986 第 5 节定义了相应的规范算法。对于 CSS 样式表，基准 URI 是样式表本身的 URI，而非源文档的 URI。

示例

例如，假设下面的规则位于：


body { background: url("yellow") }

由该 URI 指定的样式表中。

http://www.example.org/style/basic.css

源文档的 BODY 背景将以该 URI 所指向的资源所描述的图像进行平铺。

http://www.example.org/style/yellow

用户代理在处理无效 URI 或指向不可用/不适用资源的 URI 时可能表现不同。

4.3.5 计数器

计数器 通过区分大小写的标识符表示（参见 counter-increment 与 counter-reset 属性）。要引用计数器的值，使用 ‘counter(<identifier>)’ 或 ‘counter(<identifier>, <‘list-style-type’>)’，令牌之间可选空白。默认样式为 ‘decimal’。

要引用同名的嵌套计数器序列，记法为 ‘counters(<identifier>, <string>)’ 或 ‘counters(<identifier>, <string>, <‘list-style-type’>)’，同样令牌之间可选空白。

请参阅 "Nested counters and scope" 在 generated content 章节中，了解用户代理如何确定计数器的值或多个值。请参阅 'content' 属性的计数器值定义，了解它必须如何将这些值转换为字符串。

在 CSS 2.1 中，计数器的值只能在 'content' 属性中引用。请注意，'none' 是一种可能的 <'list-style-type'>：'counter(x, none)' 将产生一个空字符串。

示例

下面是一个样式表，它为每个章节（h1）中的段落（p）编号。段落使用罗马数字编号，后跟一个句点和一个空格。


p {counter-increment: par-num}
h1 {counter-reset: par-num}
p:before {content: counter(par-num, upper-roman) ". "}

4.3.6 颜色

<color> 可以是关键字，也可以是数值式的 RGB 规范。

颜色关键字列表为：aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, orange, purple, red, silver, teal, white, and yellow。这 17 种颜色的对应值如下：

maroon #800000 red #ff0000 orange #ffA500 yellow #ffff00 olive #808000
purple #800080 fuchsia #ff00ff white #ffffff lime #00ff00 green #008000
navy #000080 blue #0000ff aqua #00ffff teal #008080
black #000000 silver #c0c0c0 gray #808080

除了这些颜色关键字外，用户还可以使用对应于用户环境中某些对象所使用颜色的关键字。有关更多信息，请参阅 系统颜色 小节。

示例


body {color: black; background: white }
h1 { color: maroon }
h2 { color: olive }

数值颜色规格使用 RGB 颜色模型。下面的示例都表示同一种颜色。

示例


em { color: #f00 }              /* #rgb */
em { color: #ff0000 }           /* #rrggbb */
em { color: rgb(255,0,0) }      
em { color: rgb(100%, 0%, 0%) }

十六进制表示法的 RGB 值格式为 ‘#’ 后紧跟三位或六位十六进制字符。三位十六进制表示（#rgb）会通过复制每位数字而不是填零来转换为六位形式（#rrggbb）。例如，#fb0 会展开为 #ffbb00。这样可以用简写（#fff）来表示白色（#ffffff），并且不受显示器颜色深度的影响。

在函数表示法中，RGB 值的格式为 'rgb('，后跟用逗号分隔的三个数值（可以是三个整数或三个百分比），最后是 ')'。整数值 255 相当于 100%，在十六进制表示中为 F 或 FF：rgb(255,255,255) = rgb(100%,100%,100%) = #FFF。空白字符 可以出现在数值周围。

所有 RGB 颜色均在 sRGB 颜色空间中指定（参见 [SRGB]）。用户代理在呈现这些颜色的精确度上可能有所不同，但使用 sRGB 能提供对颜色应为何的明确且客观可测的定义，并且可以关联到国际标准（参见 [COLORIMETRY]）。

符合规范的用户代理可能仅对颜色执行伽马校正。sRGB 在指定的观看条件下规定显示伽马为 2.2。用户代理应调整 CSS 中给出的颜色，使其与输出设备的“自然”显示伽马相结合后，产生有效的 2.2 伽马。请注意，仅 CSS 中指定的颜色会受到影响；例如，图像应携带其自身的颜色信息。

当已知设备色域时，位于设备色域之外的值应被裁剪或映射到色域内：红、绿、蓝数值必须修改为落在设备支持的范围内。用户代理可以对颜色进行更高质量的色域映射。对于典型的 CRT 显示器，其设备色域与 sRGB 相同，下面四条规则是等价的。

示例


em { color: rgb(255,0,0) }       /* integer range 0 - 255 */
em { color: rgb(300,0,0) }       /* clipped to rgb(255,0,0) */
em { color: rgb(255,-10,0) }     /* clipped to rgb(255,0,0) */
em { color: rgb(110%, 0%, 0%) }  /* clipped to rgb(100%,0%,0%) */

其他设备（如打印机）拥有不同于 sRGB 的色域；有些超出 0..255 sRGB 范围的颜色在设备色域内是可表示的，而有些落在 0..255 sRGB 范围内的颜色却超出设备色域，需要被映射。

注意。 颜色值的映射或裁剪应基于实际设备色域（如果已知），该色域可能大于或小于 0..255。

4.3.7 字符串

字符串 可以使用双引号或单引号书写。双引号不能出现在双引号内部，除非使用转义（例如，'\"' 或 '\22'）。单引号同理（例如，"\'" 或 "\27"）。

示例

"this is a 'string'"
"this is a \"string\""
'this is a "string"'
'this is a \'string\''

字符串不能直接包含 newline。要在字符串中加入换行符，请使用在 ISO-10646 (U+000A) 中表示换行字符的转义序列，如 "\A" 或 "\00000a"。此字符代表 CSS 中的通用 “换行” 概念。参见 'content' 属性的示例。

可以出于美观或其他原因将字符串跨多行书写，但在这种情况下换行本身必须用反斜杠 (\) 转义。例如，下面两个选择器完全相同。

示例


a[title="a not s\
o very long title"] {/*...*/}
a[title="a not so very long title"] {/*...*/}

4.3.8 不支持的值

如果 UA 不支持某个特定值，应在解析样式表时忽略该值，就像它是一个非法值一样。例如：

示例


  h3 {
    display: inline;
    display: run-in;
  }

A UA that supports the 'run-in' value for the 'display' property will accept the first display declaration and then "write over" that value with the second display declaration. A UA that does not support the 'run-in' value will process the first display declaration and ignore the second display declaration.

4.4 CSS 样式表表示

A CSS style sheet is a sequence of characters from the Universal Character Set (see [ISO10646]). For transmission and storage, these characters must be encoded by a character encoding that supports the set of characters available in US-ASCII (e.g., UTF-8, ISO 8859-x, SHIFT JIS, etc.). For a good introduction to character sets and character encodings, please consult the HTML 4 specification ([HTML4], chapter 5). See also the XML 1.0 specification ([XML10], sections 2.2 and 4.3.3, and Appendix F)。

When a style sheet is embedded in another document, such as in the STYLE element or "style" attribute of HTML, the style sheet shares the character encoding of the whole document。

When a style sheet resides in a separate file, user agents must observe the following priorities when determining a style sheet's character encoding (from highest priority to lowest)。

  1. HTTP “Content-Type”字段中的 “charset” 参数（或其他协议中的类似参数）
  2. BOM 和/或 @charset（见下文）
  3. <link charset=""> 或链接机制提供的其他元数据（如果有）
  4. 引用的样式表或文档的字符集（如果有）
  5. 假设为 UTF-8

Authors using an @charset rule must place the rule at the very beginning of the style sheet, preceded by no characters. (If a byte order mark is appropriate for the encoding used, it may precede the @charset rule.)

After "@charset", authors specify the name of a character encoding (in quotes). For example

@charset "ISO-8859-1";

@charset 必须原样书写，即 10 个字符 '@charset "'（小写，不使用反斜杠转义），随后是编码名称，最后是 '";'。

The name must be a charset name as described in the IANA registry. See [CHARSETS] for a complete list of charsets. Authors should use the charset names marked as "preferred MIME name" in the IANA registry.

User agents must support at least the UTF-8 encoding.

User agents must ignore any @charset rule not at the beginning of the style sheet. When user agents detect the character encoding using the BOM and/or the @charset rule, they should follow the following rules

User agents must ignore style sheets in unknown encodings.

4.4.1 引用在字符编码中未表示的字符

A style sheet may have to refer to characters that cannot be represented in the current character encoding. These characters must be written as escaped references to ISO 10646 characters. These escapes serve the same purpose as numeric character references in HTML or XML documents (see [HTML4], chapters 5 and 25).

The character escape mechanism should be used when only a few characters must be represented this way. If most of a style sheet requires escaping, authors should encode it with a more appropriate encoding (e.g., if the style sheet contains a lot of Greek characters, authors might use "ISO-8859-7" or "UTF-8").

Intermediate processors using a different character encoding may translate these escaped sequences into byte sequences of that encoding. Intermediate processors must not, on the other hand, alter escape sequences that cancel the special meaning of an ASCII character.

Conforming user agents must correctly map to ISO-10646 all characters in any character encodings that they recognize (or they must behave as if they did).

For example, a style sheet transmitted as ISO-8859-1 (Latin-1) cannot contain Greek letters directly: "κουρος" (Greek: "kouros") has to be written as "\3BA\3BF\3C5\3C1\3BF\3C2".

Note. In HTML 4, numeric character references are interpreted in "style" attribute values but not in the content of the STYLE element. Because of this asymmetry, we recommend that authors use the CSS character escape mechanism rather than numeric character references for both the "style" attribute and the STYLE element. For example, we recommend


<SPAN style="font-family: L\FC beck">...</SPAN>

而不是


<SPAN style="font-family: L&#252;beck">...</SPAN>

上一个   下一个   目录   属性   索引