26

憶測ではなく、メーリングリストのディスカッションなどへのリンクを探しています。

CSSセレクターレベル3仕様から引用されたエラー処理ルールの背後にある理論的根拠を見つけるのを誰かが助けてくれますか？

ユーザーエージェントは、解析エラーを処理するためのルールを遵守する必要があります。

  • 宣言されていない名前空間プレフィックスを含む単純なセレクターは無効です
  • 無効な単純セレクター、無効なコンビネーター、または無効なトークンを含むセレクターは無効です。
  • 無効なセレクターを含むセレクターのグループは無効です。

セレクターを再利用する仕様では、解析エラーの処理方法を定義する必要があります。（CSSの場合、セレクターが使用されるルール全体が削除されます。）

私には次のルールがありました：

#menu li.last, #menu li:last-child {
  ...
}

IE8の最後の子のサポートの欠如を補うために、私はクラスとJavaScriptシムを使用しました。ただし、IE8はエラー処理に関するCSS仕様に準拠しているため、これは機能しませんでした。また、1つのセレクターを認識しないため、ルール全体が破棄されます。これは、2つのセレクターを個別のルールに分離することで修正できます。

なぜこれが望ましいのですか？なぜ仕様は、認識されないセレクターを単に破棄し、残りのルールを保持することを提案しないのですか？

ルールは現在直感に反しているように思われるので、その理論的根拠を知りたいと思います。

4

1 に答える 1

38

なぜこれが望ましいのですか？仕様では、認識されていないセレクターを単に破棄し、残りのルールを維持することを提案していないのはなぜですか?

簡単な答えは、実装が「ルールの残りの部分」(または「セレクターリストの残りの部分」) を正確に構成するものを理解するのが難しすぎるためです。エラー処理の一貫性と、将来の仕様との前方互換性のためです。

長い回答の前に、無効なセレクターの処理に関する私の別の回答へのリンクを示します。その回答に対するコメントは、ルール セット内のセレクターのエラーの処理に関するCSS2.1 仕様のセクション 4.1.7 を直接指しており、例としてセレクターのコンマについて言及しています。私はそれをかなりうまくまとめていると思います：

CSS 2.1 では、セレクターのコンマ (,) に特別な意味があります。ただし、将来の CSS の更新でコンマが別の意味を持つかどうかは不明であるため、セレクターのどこかにエラーがある場合は、CSS 2.1 ではセレクターの残りの部分が妥当に見える場合でも、ステートメント全体を無視する必要があります。

コンマ自体は、セレクターに関する限り、2 つ以上のセレクターをグループ化することを意味しますが、セレクター 4 では、セレクター グループ (またはセレクター リスト) を引数として受け入れる新しい機能的な疑似クラスが導入されていることがわかります:matches()。:not()はリストを受け入れ、 に似ています:matches()が、レベル 3 では単一の単純なセレクターしか受け入れません)。

これは、ルールに関連付けられたコンマ区切りのセレクターのグループを見つけるだけでなく、機能的な疑似クラス内でもそれらを見つけ始めることを意味します (これはスタイルシート内のみにあることに注意してください。CSS の外部では、セレクターはセレクター ライブラリとネイティブセレクター APIで使用される JavaScript コード）。

唯一の理由ではありませんが、これだけでもパーサーのエラー処理ルールが過度に複雑になり、セレクター、ルール セット、さらにはレイアウトが壊れる大きなリスクが生じる可能性があります。カンマによる解析エラーが発生した場合、パーサーは、このセレクター グループがルール セット全体に対応するのか、それとも別のセレクター グループの一部に対応するのかを判断するのに苦労し、それに応じて残りのセレクターとそれに関連するルール セットを処理する方法を判断するのに苦労します。 . 推測しようとする代わりに、間違った推測をして何らかの方法でルールを破る危険を冒す (たとえば、すべての間違った要素を一致させてスタイルを設定するなど)、最も安全な方法は、ルールを破棄して先に進むことです。

例として、セレクターがレベル 4 では有効であるが、レベル 3 では有効でない次のルールを検討してください。

#sectors > div:not(.alpha, .beta, .gamma) {
    color: #808080;
    background-color: #e9e9e9;
    opacity: 0.5;
}

Selectors 4 を理解していないナイーブなパーサーは、カンマのみに基づいて、リストを受け入れる疑似クラスを持つ単一のセレクターではなく、同じ宣言ブロックを共有する 3 つの異なるセレクターにこれを分割しようとする場合があります。

#sectors > div:not(.alpha
.beta
.gamma)

明らかに無効な最初と最後のセレクターを単純に破棄し、有効な 2 番目のセレクターを残した場合、 class を持つ要素にルールを適用する必要がありますbetaか? これは明らかに作成者が意図していることではないため、ブラウザがそれを行うと、このレイアウトに予期しないことを行うことになります。無効なセレクターを含むルールを破棄することで、レイアウトは少しだけ正気に見えますが、これは単純化しすぎた例です。レイアウトを変更するスタイルのルールは、間違って適用するとさらに大きな問題を引き起こす可能性があります。

もちろん、セレクターの解析で他のあいまいさも発生する可能性があり、次のような状況につながる可能性があります。

  • 複雑なセレクターがどこで終わるかわからない
  • セレクターリストがどこで終わるかわからない
  • 宣言ブロックの開始位置がわからない
  • 上記の組み合わせ

繰り返しますが、これらはすべて、推測ゲームをプレイする代わりにルールセットを破棄することによって最も簡単に解決されます.

あなたの例の疑似クラスなど、認識されていない一見整形式のセレクターの場合:last-child、仕様では、認識されていないセレクターと単なる不正なセレクターを区別しません。どちらも解析エラーになります。リンク先と同じセクションから：

無効は、認識されないトークンや現在の解析ポイントで許可されていないトークンなどの解析エラーによって発生します。

そして、:last-child私は、ブラウザが単一のコロンとそれに続く任意の ident を疑似クラスとして最初に解析できると仮定しています。実際には、機能的な擬似クラスは CSS2 まで登場しなかったため、実装が:last-child擬似クラスとして正しく解析することを知っているとは想定できません。:lang():not()

セレクターは、既知の疑似クラスと疑似要素の特定のセットを定義します。その名前は、すべての実装でハードコーディングされている可能性が最も高いです。最もナイーブなパーサーは、単一/二重コロンを含む各疑似クラスと疑似要素の表記全体をハードコーディングしています (主要なブラウザーが実際にこれを:before, :after,として実行しても驚かないでしょう)。特別な場合）。したがって、ある実装にとって疑似クラスのように見えるものは、別の実装にとってはうんざりしたものである可能性があります。:first-letter:first-line

実装が失敗する方法は非常に多いため、仕様では区別がなく、エラー処理がはるかに予測しやすくなっています。セレクターが認識されない場合、それがサポートされていないか形式が正しくないかどうかに関係なく、ルールは破棄されます。シンプルでわかりやすく、理解するのに十分なほど簡単です。

とはいえ、www-style パブリック メーリング リストには、仕様を変更することを提案する議論が少なくとも1 つあります。

また、一部のレイアウト エンジンでは動作が異なることにも言及する必要があります。たとえば、WebKit はルール内の WebKit プレフィックスのないセレクターを無視し、独自のプレフィックスを適用しますが、他のブラウザーはルールを完全に無視します (スタック オーバーフローでより多くの例を見つけることができます。別のもの）。ある意味では、WebKit はルールをそのまま回避していると言えますが、接頭辞付きのセレクターにもかかわらず、コンマ区切りのセレクター グループをスマートに解析しようとします。

ワーキング グループには、この動作を変更する説得力のある理由がまだないと思います。実際、どちらかといえば、変更しない説得力のある理由があり、それは、サイトが長年にわたってこの動作に依存してきたためです. 以前は、古いバージョンの IE をフィルタリングするためのセレクター ハックがありました。現在、他のブラウザをフィルタリングするための接頭辞付きのセレクタがあります。これらのハッキングはすべて、認識できないルールを破棄する特定のブラウザーの同じ動作に依存しています。他のブラウザーは、たとえば、プレフィックスを認識して (または WebKit のように、認識されていないものだけを破棄して)、ルールが正しいと判断した場合にルールを適用します。この規則が変更された場合、これらのブラウザーの新しいバージョンではサイトが壊れる可能性があります。これは、私たちのような多様化した (断片化された) Web では絶対に起こり得ません。

2013 年 4 月の時点で、テレコンで、上記で仮定した理由により、この動作は変更されないままであることが決定されました。

   - 解決済み:セレクターに MQ スタイルの無効化を採用しない
               これは、Web 互換性の問題によるものです。

メディア クエリ スタイルの無効化は、ルール全体に違反しない、コンマ区切りリスト内の無効なメディア クエリを参照します。@media

于 2012-12-12T02:32:08.503 に答える