Column9. 「スタイルの優先順位」
スタイルシートを表示に反映させるには、外部ファイルを読込む方法と、HTMLに直接書く方法があります。また、閲覧するユーザーや使用されるブラウザが独自のスタイルシートを持っている場合もあります。このため、ひとつのページを表示しようとする時、多種のスタイル設定が競合してしまうことも起こりえるわけです。そこで、スタイルシートには表示に反映される優先順位が予め定められています。 まず、ページの作成者側では外部ファイル、<head>〜</head>に書込まれた設定、<body>〜</body>に書込まれた設定の3種類があるわけですが、詳細設定ほど必ず反映されなければならないものですから、<body>内にインラインで書込まれた設定が最優先されることになっています。次に<head>内のもの、最後が外部ファイルです。従って、サイト全体のデザインを外部ファイルで指定してあっても、ページごとに一部のデザインを変更することが可能なわけですね。
更に、ネット上で閲覧される場合は、作成者、閲覧者、ブラウザの3種類の設定が有り得ることになりますが、これはまず作成者が最優先されます。次に閲覧者、最後にブラウザです。
以上のように決められている優先順位ですが、いくつもの設定が競合すると、内容によっては意図した表示が得られないことも起こりえます。そこで、「プロパティ: 値;」の直後に「!important」と書き加えると、どのような場合でもその設定が必ず最優先されます。但し、もし閲覧者側のスタイルシートにも同じ記述があると、そちらの設定が優先されることになっています。 優先順位についてはこれくらいの知識があれば十分だと思いますが、更に細かな設定どうしが重なるとブラウザはより詳細な指示に従って表示に反映するようです。例えば、ひとつのCSSファイルの中で設定が重複した場合は、「!important」が指定されているもの > idセレクタでの設定 > クラスセレクタでの設定 > 要素名での設定の順に優先されます。合わせて覚えておいて下さい。
|
2007.7.12.-7.13.
