2012-01-09 7 views
0

!importantプロパティをブラウザのCSSコードでオーバーライドする方法はありますか?ブラウザは、styleまたはlinkタグで定義されたページのCSSのあとに、プリコンパイルされたCSSを読み込んでいるようです。デフォルトのチェックボックスやラジオボタンから枠線や色を削除したいのですが(appearanceは重要ではないため、簡単に無効にすることができます)、私のCSSはuserstylesで動作しますが、実際のWebページでは動作しません。ブラウザよりも重要!

答えて

1

どれページ(著者)スタイルシートは、ブラウザのデフォルトのスタイルシートを上書きします。ブラウザのスタイルシートには!importantはありません。特異性はここではカスケードの規則によって重要ではない。重要なのは、最初の場所ではCSSでプレゼンテーション機能の一部を制御できないということです。デモ:

<!doctype html> 
<style> 
* { border: none; } 
</style> 
<input value=foo><br> 
<input type=checkbox checked> 

これは、テキスト入力ボックスのデフォルトの枠線を削除します。ほとんどのブラウザでは、チェックボックスレンダリングには影響しません。なぜなら、境界線として表示されるものは、実際にはチェックボックスウィジェットの一部なのでです。 IEは通常どおり、動作が異なりますが、その上でさえ、 "境界線"を削除することはできません。また、要素上に独自の境界線を使用すると、枠線は境界線の外に描画されます。

標準的なCSS以外の方法でブラウザの動作に影響を与える可能性があります。 「ユーザースタイル」で動作するブラウザとブラウザで何が動作するかを詳しく説明する必要があるかもしれません。

+0

ブラウザのスタイルシートには重要なものがあります。たとえばFirefoxには、チェックボックスとラジオボタンの境界線と色(外観では見えません)があります。それらを作る!あなた自身のスタイルシートで重要なことは何もしません。 – Triang3l

+0

@SiPlus、私は訂正し、Firefoxは仕様に違反していますが、私たちができることはないようです。 '-moz-appearance:none'を設定すると外観は変わりますが、チェックボックスはそのままです。基本的に異なるアプローチでチェックボックスを作成する唯一の方法は、希望の外観を持つ要素(イメージなど)を作成し、それに(JavaScriptを使用して)チェックボックス機能を関連付けることです。 –

0

ブラウザのデフォルトCSSを「削除」したいのですか?
私はあなたがリセットCSSでそれを行うことができると思う、それは基本的にブラウザのスタイリングをリセットする。 そこHERESに1

多くの例があります:CSS reset

0

はい。 Javascriptを使用して、ロード後に要素からスタイルを削除します。
または、スタイルシートを最初にデザインしてください。

0

私が知っているものは:外部CSS、内部CSS、およびインラインCSSです。オーバーライドされた順序は、

外部<内部<インラインです。

つまり、外部CSSは内部でオーバーライドされ、内部、外部はインラインで上書きされます。

また、JavaScriptを使用して更新することもできます。

0
  1. 元のセレクタと少なくとも同じ具体的なセレクタを使用して、スタイルを宣言します。
  2. マーク!重要
  3. 宣言/スタイルシートを含める後、既存のスタイル

を使用してオーバーライドするスタイルはここで最後!重要なスタイルは、以前のスタイルを引き継ぐ優先順位を宣言した例、です。

http://jsfiddle.net/8QHQk/1/

関連する問題