Webブラウザエンジニアリング ―Chrome開発者たちから学ぶ、作って理解するブラウザとWebの仕組み

6章スタイルの適用

　前の章では、各pre要素に灰色の背景を設定しました。見た目は問題ありませんし、デフォルト値があるのは良いことですが、Webサイトの著者は自分たちのサイトの見た目を自由に決めたいと考えています。Webサイトでは「Cascading Style Sheets （CSS）」[1]を使って自由なスタイリングを実現しています。CSSにより、Web開発者（そしてこの章の後で紹介するように、ブラウザ開発者）はWebページがどのように見えるべきかを定義できます。

6.1　関数によるパース

　Webページがその外観を変更する方法のひとつはstyle属性を使用することです。例えば、次のHTMLは要素の背景色を変更します。

<div style="background-color:lightblue"></div>

　より一般的に言うと、style属性にはセミコロンで区切られたプロパティと値のペアが含まれます。ブラウザはこれらのCSSプロパティと値のペアを解釈して、要素の見た目（例えば、その背景色など）を決定します。

　これを私たちのブラウザに追加するには、まずこれらのプロパティと値のペアをパースすることから始める必要があります。私たちのブラウザでは再帰的な「パース関数（parsing function）」を使用します。再帰的な関数は複雑なパーサーを段階的に構築するための良い方法です。各パース関数はパース対象のテキストを読み進め、パースしたデータを返すという考え方です。異なる種類のデータに対して異なる関数を用意し、それらをCSSParserクラスにまとめます。このクラスは、パース対象のテキストとパーサーの現在位置を保持します。

class CSSParser:
    def