CSS1 テストスイート: 7.1 前方互換的な解析

下記のテキストに適用されるスタイル宣言は、つぎのとおりです。

P.one {color: green; rotation: 70deg;}
P.oneb {color: green;}
P.oneb {color: invalidValue;}
P.two {background-color: inherit;}
H1 + P.three {color: blue;}
P.four + H1 {color: red;}
P.five {background-color: "red";}
P.sixa {border-width: medium; border-style: solid;}
P.sixb {border-width: funny; border-style: solid;}
P.sixc {border-width: 50zu; border-style: solid;}
P.sixd {border-width: px; border-style: solid;}
@three-dee {
 @background-lighting {
  azimuth: 30deg;
  elevation: 190deg;
  }
 P.seven { color: red }
 }
P.eight {COLOR: GREEN;}
OL:wait {color: maroon;}
P.ten:first-child {color: maroon;}
UL:lang(fr) {color: gray;}
BLOCKQUOTE[href] {color: navy;}
ACRONYM[href="foo"] {color: purple;}
ADDRESS[href~="foo"] {color: purple;}
SPAN[lang|="fr"] {color: #c37;}
@media tty {
 H1 {color: red;}
 P.sixteen {color: red;}
 }
@three-dee {
 P.seventeen {color: red }
 }
P.eighteena {text-decoration: underline overline line-through diagonal;
            font: bold highlighted 100% sans-serif;}
P.eighteenb {text-decoration: underline overline line-through diagonal;
            font: bold highlighted 100% serif;}
EM, P.nineteena ! EM, STRONG {font-size: 200%; }

// UL.nineteenb,
P.nineteenb {color: red;}

P.twentya {rotation-code: "}"; color: blue;} 
P.twentyb {rotation-code: "\"}\""; color: green;}
P.twentyonea {rotation-code: '}'; color: purple;} 
P.twentyoneb {rotation-code: '\'}\''; color: green;}
P.twentytwo {
 type-display: @threedee {rotation-code: '}';};
 color: green;
 }
P.twentythree {text-indent: 0.5in;}
 color: maroon
P.twentyfour {color: red;}

この段落は緑色のはずです。 rotation だけが無視されるはずだからです。

この段落は緑色のはずです。 エラーチェックは特定度を計算する前になされるはずだからです。

この段落には無地の灰色の背景(または白色の方眼)があるはずです。 CSS1では inherit は規則に違反するキーワードですし、CSS2では(白色の方眼ではなく)灰色の背景が継承されることになるからです。

この段落は黒色のはずです。 CSS1ではセレクタは規則に違反しており、CSS2ではセレクタが適用されないからです。

この段落は黒色のはずです。 CSS1ではセレクタは規則に違反しており、CSS2ではセレクタが適用されないからです。

この段落には白色の背景があるはずです。 キーワードは引用符で括ることができないからです。

この段落には周囲に(次の３つの段落と同じ) medium 幅のボーダーがあるはずです。 このため、ユーザエージェントはデフォルト値の 'medium' を使うことになるはずです。

この段落には周囲に(前の段落や次の２つの段落と同じ) medium 幅のボーダーがあるはずです。 border-width は規則に違反しているからです。 このため、ユーザエージェントはデフォルト値の 'medium' を使うことになるはずです。

この段落には周囲に(次の段落や前の２つの段落と同じ) medium 幅のボーダーがあるはずです。 border-width の単位が規則に違反しており、そのため border-width は無視されるはずだからです。 このため、ユーザエージェントはデフォルト値の 'medium' を使うことになるはずです。

この段落には周囲に(前の３つの段落と同じ) medium 幅のボーダーがあるはずです。 border-width にはそのピクセル単位にくっつく値がなく、規則に違反しているからです。 このため、ユーザエージェントはデフォルト値の 'medium' を使うことになるはずです。

この段落は黒色のはずです。 適用されるスタイル宣言が、規則に違反したアットルールの中にあるからです。

この段落は緑色のはずです。 CSSは、他の標準規格(例. フォント名やURL)との相互関係で大文字小文字の区別をすることを要求されるのでない限り、大文字小文字を区別しません。

1. この有順序リスト項目は黒色のはずです。 宣言に規則に違反した疑似クラスセレクタがあるからです。

この段落は黒色のはずです。 CSS1では :first-childe は規則に違反した疑似クラスですし、CSS2ではこの段落は最初の子ではないからです。

• この無順序リスト項目は黒色のはずです。 CSS1によるとセレクタは規則に違反していますし、CSS2によるとセレクタは適用されないはずだからです。

このブロック引用は黒色のはずです。 CSS1によるとセレクタは規則に違反していますし、CSS2によるとセレクタは適用されないはずだからです。

この頭字語は黒色のはずです。 CSS1によるとセレクタは規則に違反していますし、CSS2によるとセレクタは適用されないはずだからです。

この区間は黒色のはずです。 CSS1によるとセレクタは規則に違反していますし、CSS2によるとセレクタは適用されないはずだからです。

この段落は黒色のはずです。 適用されるスタイルシート宣言が、規則に違反したアットルールの中にあるからです。 もっとも、CSS2では規則に適合していますから、これをCSS2をサポートするttyブラウザを見ている場合には、これは赤色のはずです。

この段落は黒色のはずです。 適用されるスタイルシート宣言が、規則に違反したアットルールの中にあるからです。

この段落のテキストは普通である(すなわち、下線や上線、取消線がついていたり太字だったりしない)はずです。 diagonal は規則に違反したキーワードで、text-decoration が規則に違反することになるからです。 さらに highlighted は規則に適合した font プロパティの一部分ではなく、プロパティが規則に違反することになります。 そのため、この段落のフォントはユーザエージェントのデフォルトになり、次の段落と一致するはずです。 そうでない場合には、font 宣言は不適切な解析をされています。

この段落のテキストは普通である(すなわち、下線や上線、取消線がついていたり太字だったりしない)はずです。 diagonal は規則に違反したキーワードで、text-decoration が規則に違反することになるからです。 さらに highlighted は規則に適合した font プロパティの一部分ではなく、プロパティが規則に違反することになります。 そのため、この段落のフォントはユーザエージェントのデフォルトになり、次の段落と一致するはずです。 そうでない場合には、font 宣言は不適切な解析をされています。

この段落のテキストは通常サイズのはずです。 セレクタが規則に違反しているからです。 この段落の中にある強調されているテキストや強く強調されているテキストは通常サイズのはずです。 (将来的なCSSのバージョンでは、コンマよりも優先するセレクタ内の演算子がありえますから)ルールセット全体がスキップされるはずです。

この段落は黒色のはずです。 宣言の前の行は注釈ではなく、P.nineteenb のセレクタは規則に違反しているからです。

この段落は青色のはずです。 最初の宣言だけが規則に違反しているからです。

この段落は緑色のはずです。 最初の宣言だけが規則に違反しているからです。

この段落は紫色のはずです。 最初の宣言だけが規則に違反しているからです。

この段落は緑色のはずです。 最初の宣言だけが規則に違反しているからです。

この段落は緑色のはずです。 最初の宣言だけが規則に違反しているからです。

この段落は2分の1インチ字下げされているはずですが、栗色ではないはずです。 それは黒色のはずです。

この段落は黒色のはずです。 前出のルールセットの後の色宣言がこのルールセットのセレクタの一部とみなされ、そのためこのルールセットには規則に違反したセレクタがあって適用されないはずだからです。