XHTML/CSS・トップ | CSS基礎知識・目次

●!importantルール

 CSSのスタイルシートはブラウザのデフォルト・スタイルシート→ユーザー・スタイルシート(用意した場合ですが)→ページ作者のスタイルシートの順に優先度が高くなります。また、ひとつのスタイルシートにおいても後から指定したスタイルが優先されます。後からとは同じセレクタのスタイルが重複した場合は最後(CSSソースの下)に指定したスタイルが優先されることです。また、普通のスタイルよりはクラスセレクタを使ったスタイルが優先され、クラスセレクタよりはIDセレクタを使ったスタイルが優先されます。

 !importantルールを使うとスタイルを優先させることができます。「プロパティ: 値」の後に半角スペースで区切り、!importantを配置します。ただし、「プロパティ: 値」ごとに指定する必要があります。

body {
 background-color: #000000 !important;
 color: #ffffff !important;
}

 ブラウザの設定で、上のスタイルをユーザー・スタイルシートにすれば、どのWebページでも背景色が黒で文字色が白で見ることができます。

 欠点は、ページ作者がクラスセレクタやIDセレクタを使っている場合、ページ作者と同じクラス名およびID名を使って、!importantルールを適用しないと優先させられない場合があります。工夫次第でスタイルを優先させられるのが!importantルールです。

XHTML/CSS・目次 | CSS基礎知識・目次

Copyright (C) 2004-2008 http://www.xml.vc/