この付録は参考情報であり、規範的なものではありません。
以下は、CSS2の最初の改訂版（CSS 2.1）に対する変更点です。CSS2仕様書（[CSS2]を参照）と CSS 2.1（[CSS21]を参照）の間の変更点は、CSS 2.1の変更点セクションに記載されています。
この章は変更点の完全なリストではありません。軽微な編集上の変更や、例に対するほとんどの変更はここには記載されていません。
[2011-10-12] “6.2.1 The 'inherit' value,” において、次のように変更:
各プロパティは 'inherit' のカスケード値を持つこともでき、これは、ある要素について、そのプロパティが
親要素のプロパティと同じ指定値を取る親要素のプロパティの計算値を指定値として取ることを意味します。
[2011-10-12] “6.1.1 Specified values,” に次の明確化を追加:
- カスケードの結果として値が得られた場合はそれを用いる。ただし、その値が 'inherit' の場合、指定値は下記の “The 'inherit' value” で定義される。
[2012-04-04] “8.3.1 Collapsing margins,” に次の項目を追加:
隣接する垂直マージンは折り畳まれる。ただし、以下は例外:
- ルート要素のボックスのマージンは折り畳まれない。
- クリアランスを持つ要素の上下マージンが隣接している場合、そのマージンは隣接する後続の兄弟のマージンと折り畳まれるが、その結果生じたマージンは親ブロックの下マージンとは折り畳まれない。
- 計算値 'min-height' が非ゼロで計算値 'height' が 'auto' のボックスの上マージンが、その最後のインフロー子の下マージンと折り畳まれる場合、その子の下マージンは親の下マージンとは折り畳まれない。
[2012-04-11] “10.7 Minimum and maximum heights: 'min-height' and 'max-height',” の注記を次のように明確化:
これらの手順は上記プロパティの実際の計算値には影響しない。使用される 'height' の変更は、"Collapsing margins"(8.3.1) における 'min-height' または 'max-height' の規則で特に要求される場合を除き、マージンの折り畳みに影響しない。これらの手順は 'height' の実際の計算値には影響しない。したがって、例えば計算値に依存するマージンの折り畳みにも影響しない。
[2012-04-11] “8.3.1 Collapsing margins,” の第2注記の7つ目の箇条書きを明確化:
'height' が 'auto' で 'min-height' が 0 のインフロー・ブロックボックスの下マージンは、ボックスに下パディングと下ボーダーがなく、かつ子の下マージンがクリアランスを持つ上マージンと折り畳まれない場合、その最後のインフロー・ブロックレベル子の下マージンと折り畳まれる。'height' が 'auto' のインフロー・ブロックボックスの下マージンは、次の場合にその最後のインフロー・ブロックレベル子の下マージンと折り畳まれる:
- ボックスに下パディングがない。
- ボックスに下ボーダーがない。
- 子の下マージンが、クリアランスを持つ上マージンとも（ボックスの min-height が非ゼロの場合は）ボックスの上マージンとも折り畳まれない。
[2012-05-02] “15.3 Font family: the 'font-family' property,” において、引用符なしのフォント名 “inherit” の使用がエラーであることを明確化:
キーワード値（'inherit'、'serif'、'sans-serif'、'monospace'、'fantasy'、'cursive'）と同じフォントファミリー名は、同名のキーワードと混同しないように引用符で囲む必要がある。'initial' と 'default' というキーワードは将来の使用のために予約されており、フォント名として使用する場合も引用符で囲む必要がある。UA はこれらのキーワードを '<family-name>' 型に一致するものとして扱ってはならない。引用符なしのフォントファミリー名が、キーワード値 'inherit'、'default'、'initial' または一般フォントのキーワード（'serif'、'sans-serif'、'monospace'、'fantasy'、'cursive'）と同一である場合、'<family-name>' 型には一致しない。これらの名前は同名のキーワードとの混同を避けるために引用符で囲む必要がある。したがって 'font-family: Times, inherit' は無効な宣言である。この位置の 'inherit' は有効なキーワードでも有効なフォントファミリー名でもないためである。
[2012-05-02] 記号と数字の間に空白やコメントは <number>、<length>、<percentage> では許可されない。“4.3.1 Integers and real numbers,” において “immediately” を次のように挿入:
整数と実数はいずれも、符号を示すために 直前に "-" または "+" を付けることができる。
“4.1.1 Tokenization,” において {num} マクロの先頭で "+" または "-" を許可:
num [-+]?[0-9]+|[-+]?[0-9]*\.[0-9]+
（これは NUMBER、DIMENSION、PERCENTAGE の3つのトークン定義を変更し、ひいては CSS のトークナイズを変更するが、文法全体として生成される言語は変わらない。）
4.3.2（<length>）および 4.3.3（<percentage>）は 4.3.1 を参照しているため変更は不要。
[2012-08-01] 10.1 “Definition of "containing block,"” を次のように変更:
- […]
- その他の要素について、要素の position が 'relative' または 'static' の場合、包含ブロックは最も近い 先祖ボックスのうち block container
である先祖ボックスまたは整形コンテキストを確立するもののコンテンツエッジによって形成される。
[2012-08-01] 9.4 “Normal flow,” を次のように置き換え:
通常フローのボックスは formatting context に属し、CSS 2 においては table、 block、または inline
（同時に両方ではない）のいずれかである。将来の CSS レベルでは他の種類の整形コンテキストが導入される。 Block-level ボックスは block formatting コンテキストに参加する。Inline-level ボックスは inline formatting コンテキストに参加する。テーブル整形コンテキストについては 表 の章で説明する。
[2012-08-01] 9.4.2 “Inline formatting contexts,” に次の文を追加:
インライン整形コンテキストは、ブロックレベルのボックスを含まない block container ボックスによって確立される。 インライン整形コンテキストでは、ボックスは包含ブロックの上端から水平方向に次々と配置される。
[2012-08-01] 17.4 “Tables in the visual formatting model,” を次のように置き換え:
テーブルがブロックレベルの場合、table wrapper box は 'block' ボックスであり、テーブルがインラインレベルの場合は 'inline-block' ボックスである。table wrapper box はブロック整形コンテキストを確立し、table box はテーブル整形コンテキストを確立する。
[2012-08-01] 17.5 “Visual layout of table contents,” を次のように置き換え:
内部テーブル要素は矩形の boxes を生成し、
withそれらは table box によって確立されたテーブル整形コンテキストに参加する。これらのボックスには コンテンツとボーダーがある。があり、 セルにはパディングもある。内部テーブル要素にはマージンはない。
[2012-08-01] 11.1.1 “Overflow: the 'overflow' property,” を次のように変更:
Applies to: block containers および整形コンテキストを確立するボックス
[2013-04-29] URI トークンの u, r, l の文字はエスケープで記述可能とする。4.1.1 “Tokenization,” の最初の表を次のように変更:
URI url{U}{R}{L}\({w}{string}{w}\)
|url{U}{R}{L}\({w}([!#$%&*-\[\]-~]|{nonascii}|{escape})*{w}\)
および2つ目の表を次のように変更:
baduri1 url{U}{R}{L}\({w}([!#$%&*-~]|{nonascii}|{escape})*{w}baduri2 url{U}{R}{L}\({w}{string}{w}baduri3 url{U}{R}{L}\({w}{badstring}
さらに2つ目の表に追加:
L l|\\0{0,4}(4c|6c)(\r\n|[ \t\r\n\f])?|\\lR r|\\0{0,4}(52|72)(\r\n|[ \t\r\n\f])?|\\rU u|\\0{0,4}(55|75)(\r\n|[ \t\r\n\f])?|\\u
[2013-04-29] URI トークンの u, r, l の文字はエスケープで記述可能（前の正誤表参照）。G.2 “Lexical scanner,” を次のように変更:
baduri1url{U}{R}{L}\({w}([!#$%&*-\[\]-~]|{nonascii}|{escape})*{w} baduri2url{U}{R}{L}\({w}{string}{w} baduri3url{U}{R}{L}\({w}{badstring}
および:
"url("{U}{R}{L}"("{w}{string}{w}")" {return URI;}"url("{U}{R}{L}"("{w}{url}{w}")" {return URI;}
[2013-04-29] U+0080〜U+009F の Unicode 制御文字を識別子や URI トークンで使用可能とする（以前はスタイルシートを無効にしていた）。4.1.1 “Tokenization,” を次のように変更:
nonascii [^\0- \237\177]
[2013-04-29] U+0080〜U+009F の Unicode 制御文字を識別子や URI トークンで使用可能とする（以前はスタイルシートを無効にしていた）。4.1.3 “Characters and case,” を次のように変更:
- CSS において、identifiers（selectors 内の要素名、クラス、ID を含む）には、[a-zA-Z0-9] と ISO 10646 の文字
U+00A0U+0080 以上、加えてハイフン (-) とアンダースコア (_) のみを含めることができる。
[2013-05-02] アウトオブバンド情報に基づき CSS ファイルが UTF 系の文字エンコーディングであることが分かっていて、かつファイルが BOM, で始まる場合、BOM がアウトオブバンド情報を上書きして使用される UTF 系エンコーディングを決定する。4.4 “CSS style sheet representation,” に次を挿入:
上記の規則1（HTTP の "charset" パラメータ等）が文字エンコーディングを与え、その値が UTF-8、UTF-16、UTF-32 のいずれかである場合、ファイル先頭に BOM があれば、それが次のようにその文字エンコーディングを上書きする:
先頭バイト（16進） 結果のエンコーディング 00 00 FE FF UTF-32（ビッグエンディアン） FF FE 00 00 UTF-32（リトルエンディアン） FE FF UTF-16（ビッグエンディアン） FF FE UTF-16（リトルエンディアン） EF BB BF UTF-8 規則1が UTF-16BE、UTF-16LE、UTF-32BE、または UTF-32LE の文字エンコーディングを与える場合、ファイル先頭に BOM があるのはエラーである。CSS UA は、指定されたエンコーディングを無視し、上の表を用いて復旧しなければならない。
UTF-16BE、UTF-16LE、UTF-32BE、UTF-32LE においてファイル先頭の BOM がエラーであることは、[UNICODE] に規定されている。
[2013-07-15] 11.1.1 “Overflow: the 'overflow' property,” において 'scroll' と 'auto' の定義を変更:
- scroll
- この値は、コンテンツが切り抜かれ、ユーザーエージェントが画面上に可視なスクロール機構（スクロールバーやパンナー等）を使用する場合、コンテンツが切り抜かれているか否かにかかわらず、その機構をボックスに表示すべきであることを示す。これにより動的環境でスクロールバーが出たり消えたりする問題を回避する。この値が指定され、対象メディアが 'print' の場合、あふれたコンテンツは印刷されてもよい。table boxes に用いた場合、この値は 'visible' と同じ意味を持つ。
- auto
- 'auto' の挙動はユーザーエージェント依存だが、あふれるボックスに対してスクロール機構を提供するべきである。table boxes に用いた場合、この値は 'visible' と同じ意味を持つ。
[2013-07-15] 15.3 Font family: the 'font-family' property の文法に角括弧の組が欠けているため、次のように修正:
Value: [[ <family-name> | <generic-family> ] [, [ <family-name>| <generic-family> ] ]* ] | inherit
[2013-07-15] 記号と数字の間に空白やコメントは <number>、<length>、<percentage> では許可されない。“G.2 Lexical scanner,” において {num} マクロを次のように変更:
num [-+]?[0-9]+|[-+]?[0-9]*"."[0-9]+
“G.1 Grammar,” において unary_operator を文法から削除:
unary_operator : '-' | '+' ;
および次のように変更:
term :unary_operator?[ NUMBER S* | PERCENTAGE S* | LENGTH S* | EMS S* | EXS S* | ANGLE S* | TIME S* | FREQ S* ] | STRING S* | IDENT S* | URI S* | hexcolor | function ;
[2013-07-18] 'height' のパーセンテージは、たとえ使用されなくても継承され得る。“10.5 Content height: the 'height' property,” の “computed value” 行を次のように変更:
Computed value: パーセンテージまたは 'auto' (see prose under <percentage>)(指定どおり)
また、<percentage> の定義を次のように変更:
- <percentage>
- パーセンテージ高さを指定する。パーセンテージは生成されたボックスの containing block の高さに対して計算される。包含ブロックの高さが明示的に指定されていない（すなわち、コンテンツ高さに依存する）場合で、この要素が絶対配置されていないなら、
値は 'auto' に計算される使用される高さは 'auto' が指定されたものとして計算される。
[2013-09-09] “4.1.1 Tokenization,” において UNICODE-RANGE トークンをより厳密に:
UNICODE-RANGE u\+[0-9a-f?]{1,6}(-[0-9a-f]{1,6})?
u\+[?]{1,6}|
u\+[0-9a-f]{1}[?]{0,5}|
u\+[0-9a-f]{2}[?]{0,4}|
u\+[0-9a-f]{3}[?]{0,3}|
u\+[0-9a-f]{4}[?]{0,2}|
u\+[0-9a-f]{5}[?]{0,1}|
u\+[0-9a-f]{6}|
u\+[0-9a-f]{1,6}-[0-9a-f]{1,6}
例: “U+A?5” は以前は1つの UNICODE-RANGE トークン（意味的には無意味）だったが、現在は “U+A?”（16 文字の範囲 U+A0〜AF を意味する）と数値 “5” の2つのトークンとなる。
[2012-09-19] “9.2 Controlling box generation” と “9.2.1 Block-level elements and block boxes” を次のように修正:
Controlling box generation
以下のセクションでは、CSS 2.1 で生成され得るボックスの種類を説明する。ボックスの種類は、視覚整形モデルでの挙動の一部に影響する。以下で説明する 'display' プロパティはボックスの種類を指定する。
'display' プロパティの特定の値は、ソース文書の要素に、子孫ボックスや生成コンテンツを含み、かつあらゆる位置決めスキームに関与する principal box を生成させる。いくつかの要素（'list-item' 要素）は主ボックスに加えて追加のボックスを生成することがある。これらの追加ボックスは主ボックスに対して配置される。
9.2.1 Block-level elements and block boxes
Block-level elements は、（段落など）視覚的にブロックとして整形されるソース文書の要素である。'display' プロパティの次の値は要素をブロックレベルにする: 'block'、'list-item'、'table'。Block-level elements（段落など、ソース文書の中で視覚的にブロックとして整形される要素）は、ブロックレベルの主ボックスを生成する要素である。要素をブロックレベルにする 'display' の値には 'block'、'list-item'、'table' が含まれる。Block-level boxes はブロック整形コンテキストに参加するボックスである。
Block-level boxes はブロック整形コンテキストに参加するボックスである。各ブロックレベル要素は、子孫ボックスや生成コンテンツを含み、かつあらゆる位置決めスキームに関与する principal block-level box を生成する。いくつかのブロックレベル要素（'list-item' 要素）は主ボックスに加えて追加のボックスを生成する。
後の章で説明されるテーブルボックスと、置換要素を除き、CSS 2 において、ブロックレベルボックスは、テーブルボックスや置換要素の主ボックスでない限り、ブロックコンテナー・ボックスでもある。block container box は、ブロックレベルボックスのみを含むか、またはインライン整形コンテキストを確立してインラインレベルボックスのみを含む。主ボックスがブロックコンテナー・ボックスである要素は block container element である。 非置換要素にブロックコンテナーを生成させる 'display' の値には 'block'、'list-item'、'inline-block' が含まれる。すべてのブロックコンテナー・ボックスがブロックレベルとは限らない。非置換の inline-block や非置換の表セルはブロックコンテナーだがブロックレベルではない。。ブロックコンテナーでもあるブロックレベルボックスは block boxes と呼ばれる。"block-level box"、"block container box"、"block box" の3つの用語は、曖昧でない場合には "block" と略されることがある。
[2012-09-19] “9.2.4 The 'display' property” を次のように修正:
- block
- この値は要素に 主ブロックボックスを生成させる。
- inline-block
- この値は要素に
an主インラインレベルのブロックコンテナーを生成させる。(inline-block の内側はブロックボックスとして整形され、要素自体は不可分のインラインレベルボックスとして整形される)。
[2012-09-19] “17.4 Tables in the visual formatting model” を次のように修正:
いずれの場合も、テーブルは table wrapper box と呼ばれる主ブロックコンテナー・ボックスを生成し、そこにはテーブルボックス自体と（文書順で）任意のキャプションボックスが含まれる。table box はテーブルの内部テーブルボックスを含むブロックレベルボックスである。キャプションボックスは主ブロックレベルボックスであり、それ自身の content、padding、margin、border を保持し、table wrapper box 内で通常のブロックボックスとして描画される。キャプションボックスがテーブルボックスの前か後ろかは、後述の 'caption-side' プロパティで決まる。
table wrapper box は、
テーブルがブロックレベルの場合は 'block' ボックス'display: table' の場合はブロックレベル、テーブルがインラインレベルの場合は 'inline-block' ボックス'display: inline-table' の場合はインラインレベルである。table wrapper box はブロック整形コンテキストを確立し、table box はテーブル整形コンテキストを確立する。'inline-table' のベースライン垂直整列には（table wrapper box ではなく）table box が用いられる。table wrapper box の幅は、17.5.2節で述べるように、その内側の table box の border-edge の幅である。テーブル上の 'width' と 'height' のパーセンテージは table wrapper box 自身ではなく、その包含ブロックに対して相対となる。
[2012-09-19] SVG との互換性のため、“4.1.1 Tokenization” におけるマクロ num の定義を次のように変更:
num[-+]?[0-9]+|[-+]?[0-9]*\.[0-9]+num [+-]?([0-9]+|[0-9]*\.[0-9]+)(e[+-]?[0-9]+)?
[2014-07-16] 'display: none' で抑制された要素からキャンバスの背景を取得することはできない。一方、要素が単に不可視（'visibility: hidden'）である場合は、その背景をキャンバスに使用できる。言い換えると、ルート要素が 'display: none' のとき、キャンバスの背景は未定義である。(X)HTML 文書の場合、ルート要素が 'background: transparent' で <body> 要素が 'display: none' のときも同様にキャンバスの背景は未定義となる。“14.2 The background” の文を次のように変更:
[…] そのような背景も、もしそれらがルート要素に対してのみ描画された場合と同じ点に固定されなければならない。
ただし、キャンバスの背景に用いられるはずの要素に対してボックスが生成されない場合、キャンバスの背景は透明である。（CSS 2 では、要素またはその先祖に 'display: none' が指定されている場合がこれに当たる。）
要素に 'visibility: hidden' が指定され、'display: none' でない場合には、ボックスは生成され、その背景はキャンバスに使用されることに注意。
[2015-07-01] 'position: fixed' の要素は 常に新しいスタッキングコンテキストを確立する。（'position: absolute' と異なり、そちらでは要素がスタッキングコンテキストを確立するかは 'z-index' に依存。）
“9.9.1 Specifying the stack level: the 'z-index' property” における 'auto' の定義を次のように変更:
- auto
- 現在のスタッキングコンテキストにおける生成ボックスのスタックレベルは 0。
そのボックスはルート要素でない限り新たなスタッキングコンテキストを確立しない。そのボックスが 'position: fixed' を持つ場合、またはルートである場合、新たなスタッキングコンテキストも確立する。
[2015-09-05] 不正な宣言の開始が at-rule の構文に合致する場合、処理方法が異なる。その場合、パースは次のセミコロンや囲んでいるブロックの閉じ波括弧ではなく、その at-rule の直後から再開する。これは以下のとおり、ルールセットのコア構文に at-rule を追加することで表現される。
“4.1.1 Tokenization” において、ruleset の生成規則を次のように変更:
ruleset : selector? '{' S* declaration? [ ';' S* declaration? ]* '}' S*;ruleset : selector? '{' S* declaration-list '}' S*; declaration-list: declaration [ ';' S* declaration-list ]? | at-rule declaration-list | /* empty */;
“4.1.7 Rule sets, declaration blocks, and selectors” において、第2段落を次のように変更:
宣言ブロックは左波括弧 ({) で始まり、対応する右波括弧 (}) で終わる。その間には 0 個以上の
セミコロン区切り (;) の宣言宣言および at-rule がなければならない。宣言はリストの最後でない限りセミコロン (;) で終わらなければならない。注: CSS level 2 にはルールセット内に現れる at-rule は存在しないが、将来のレベルで定義される可能性がある。
“4.2 Rules for handling parsing errors” において、不正な宣言の規則を次のように変更:
Malformed declarations. UA は宣言の構文解析中に予期しないトークンに遭遇した場合、()、[]、{}、""、'' の対応規則を守り、エスケープを正しく処理しながら、その宣言の終わりまで読み進めなければならない。例えば、不正な宣言はプロパティ名やコロン (:)、プロパティ値が欠けている場合がある。
UA が宣言または at-rule の開始（すなわち IDENT トークンまたは ATKEYWORD トークン）を期待しているときに、代わりに予期しないトークンを見つけた場合、そのトークンは不正な宣言の最初のトークンと見なされる。すなわち、その場合に無視すべきトークンを決定するには、不正な文ではなく不正な宣言の規則を用いる。
以下はすべて同等である:
p { color:green } p { @foo { bar: baz } color:green } /* unknown at-rule */ p { color:green; color } /* malformed declaration missing ':', value */ p { color:red; color; color:green } /* same with expected recovery */ p { color:green; color: } /* malformed declaration missing value */ p { color:red; color:; color:green } /* same with expected recovery */ p { color:green; color{;color:maroon} } /* unexpected tokens { } */ p { color:red; color{;color:maroon}; color:green } /* same with recovery */
最後に、“13.2 Page boxes: the @page rule” において、現在は冗長となった次の文を削除:
@page 内の不正な宣言、不正な文、無効な at-rule を扱う規則は section 4.2 に定義されているが、次の追加事項がある: UA が宣言または at-rule の開始（すなわち IDENT トークンまたは ATKEYWORD トークン）を期待しているときに、代わりに予期しないトークンを見つけた場合、そのトークンは不正な宣言の最初のトークンと見なされる。すなわち、その場合に無視すべきトークンを決定するには、不正な文ではなく不正な宣言の規則を用いる。