ブラウザ互換について-継承-

これまでにもブラウザによって表示のされ方が違うということは話題にしてきました。 いや、ホントに面倒な話ですが規格が統一されてないので様々な所で不具合が発生しちゃうんですよね。

前回のドキュメントタイプでも出て来た標準モードと互換モードなのですが、 いくつか、もう致命的に酷い違いがあるんですよ。

■継承について
まずは継承についての説明から必要ですね。

例えば、bodyタグ内で文字サイズをsmallと設定していたとしましょう。
body { font-size:small; }

これでbodyの中身の文字のサイズは通常smallとなるわけですね。 しかし、bodyの中に新たなボックス要素（divとかtableとか）が出て来た場合、 bodyでの設定は有効なのか無効なのか？ということです。 それをセレクタの継承と言います。

継承される場合、これは簡単ですね。そのまんま設定されてた物が適用されるだけです。 継承されない場合、これは何も設定されてないことになり、デフォルトの設定が適用されます。

また、適用されない場合はそれはそれでもう１回適用させてやれば良いだけの話なので実際にブラウザで確認してみて、 変な所があれば設定してやれば良いでしょう。

ちなみに、継承の有無はこんな感じです。
標準モード　⇒　継承される
互換モード　⇒　継承されない

注意事項：
継承される場合の注意事項です。文字サイズを相対的な設定（%指定や、em指定）で設定している場合、 2回以上設定してしまうと全ての設定が生きてしまいます。

例えば標準モードでこんな場合です
body { font-size:80%; } table { font-size:80%; }

こんな設定のテーブルの中の文字はbodyの80％が適用され、tableの80％も適用されるので、 80%の80%⇒64%になってしまいます。 絶対的な設定（px指定やsmallなど）の場合は、上書きされる事になるので問題ありません。

■HP作成-応用編-

・外部ファイルを使ってみよう
・リンクの設定変更
・お気に入りに追加＋ホームに設定
・非推奨タグ・属性
・ドキュメントタイプについて
・ブラウザ互換について-width-
・ブラウザ互換について-継承-
・ブラウザ互換について-外部CSS-