Dev Study
← 解説「CSSOM — ルールは prelude と宣言ブロック、読めないものは捨てて先へ進む」に戻る

サンプルコードで身につける: CSSOM — ルールは prelude と宣言ブロック、読めないものは捨てて先へ進む

解説で学んだ概念を、3つの具体例で確認します。素朴な例から実務寄りの例へと進みます。

1qualified rule = prelude + 宣言ブロック、declaration = 名前 + 値

CSS Syntax Level 3 §5 の定義どおり、列を { まで読んだものを ()、{ から } までをのとして に入れます。宣言は「名前 : 値 ;」の繰り返しで、ここでは値を単語 1 つに限った素朴版です。実行すると 3 つのルールについて prelude(p / .note / #main)と、その中の Declaration が = value の形で出ます。

Rust

2読めない宣言は捨ててルールは生かす、at-rule は読み飛ばす

CSS Syntax Level 3 §5 の設計は「壊れていても止まらない」ことです。: が無い宣言は次の ; までを捨てて同じルールの残りの宣言は生かし、@charset や @media のような at-rule は ; か対応する } まで丸ごと読み飛ばし、読めないセレクタ(div p)は Unsupported として残して何にも一致させません。実行すると p ルールは background-color だけが残り、2 つの at-rule を飛ばした記録と、捨てた宣言 "color red" の記録が出ます。

Rust

3実務に写す: INI 風の設定を「読めない行は捨て、セクションは生かす」で読む

[section] と key = value からなる設定ファイルを、 と同じ「ルール = 名前 + 宣言の列」の形で持ち、CSS と同じ捨て方をします。= が無い行、名前が空の [] 、セクションの外にある行はそれぞれ記録して捨て、セクション自体は残します。実行すると [server] 2 個・[database] 2 個の項目と、捨てた 3 行の記録が行番号つきで出ます。

Rust

図やコードに出てくる用語(タップで説明)