[解決済み] CSSにおける「!important」の意味とは?
質問
とは何ですか?
!important
はCSSでどういう意味ですか?
CSS 2で利用できますか?CSS 3ですか?
どこでサポートされていますか?すべてのモダンブラウザー?
解決方法は?
つまり、「これは重要であり、後続のルールや通常の特異性の問題は無視し、適用する」ということである。 これ ルール!』です。
通常の使用では、外部スタイルシートで定義されたルールは、そのスタイルに優先して
head
を使用すると、要素自体のインライン・スタイルによって上書きされます(セレクタの具体性が等しいと仮定して)。セレクタを使用してルールを定義すると
!important
属性」(?)は、「後の」ルールが「前の」ルールを上書きするという、通常の懸念を払拭します。
また、通常、より具体的なルールは、より具体的でないルールを上書きします。だから
a {
/* css */
}
は通常、上書きされます。
body div #elementID ul li a {
/* css */
}
後者のセレクタの方がより具体的であるため(そして通常、より具体的なセレクタがどこにあるかは問題ではありません)。
head
または外部スタイルシート)は
それでも
は、あまり特定されていないセレクタを上書きします(インラインのスタイル属性は
常に
は、'more-' または 'less-' に指定されたセレクタを上書きし、そのセレクタは
常に
より具体的です。
しかし、もしあなたが
!important
を指定しない方のセレクタのCSS宣言に追加すると、そちらが優先されます。
使用方法
!important
しかし、それはキツネが鶏を殺すのを止めるために核爆発を使うようなものです。確かにキツネは殺されるが、ニワトリも殺される。
また、CSSのデバッグが悪夢のようになります(個人的、経験的、経験から)。
関連
-
[CSSチュートリアル】 css border add four corners コード
-
[CSSチュートリアル】Chromeのタブバーを実装するためのCSSのコツ
-
[CSSチュートリアル】CSSで実現するTikTokのテキストジッター効果例
-
[解決済み] CSSの親セレクタはありますか?
-
[解決済み] CSSでcellpaddingとcellspacingを設定する?
-
[解決済み] How do I style a <select> dropdown with only CSS?
-
[解決済み] CSSセレクタの"~"(チルダ/スクイグル/ツイドル)はどういう意味ですか?
-
[解決済み] CSSセレクタの">"(大なり小なり)とはどういう意味ですか?
-
[解決済み】CSSを使用して、すべてのブラウザでdiv要素を垂直方向に中央に配置するにはどうすればよいですか?
-
[解決済み】HTML5入力のプレースホルダの色をCSSで変更する。
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[CSSチュートリアル】CSS たった1行のコードでアバターと国旗の一体化を実現
-
[CSSチュートリアル】 css border add four corners コード
-
[CSS3] CSS3リスト無限スクロール/回転効果
-
[CSSチュートリアル】CSSのシングルDivの描画スキル
-
[CSSチュートリアル]cssのbackgroundとborderタグの例 詳細
-
[CSSチュートリアル]css display table adaptive height, widthの問題解決
-
[CSSチュートリアル】ボックス内の複数要素を両端揃えの効果で実現するCSS
-
[CSSチュートリアル】タイトルを上部に配置するスティッキーレイアウトを実現するためのCSS
-
[css3]スクロールバー美化効果を実現するcss3サンプルコード
-
[解決済み】CSSで"!important "を使用する意味は?[重複あり]