案外、これに関して言及しているところがないので書いてみる
CSSの!importantとは
CSSの反映されるものを決める 詳細度 という概念があるが、そこで決まる順番とは関係なく設定できる記述
例
cssは後勝ちなので、後の記述のほうが優先されるが、以下の例の場合はblueの記述のほうが優先される
.sample h1{ color: blue!important; } .sample h1{ color: orange; }
使いたくなったらどうするか
MDNのドキュメントに記述があるのでそこを参考にすると良い
いくつかの経験則
・!important を考える前に、常に詳細度を使用する方法を探しましょう。
・ページ固有の CSS が外部の CSS (ブートストラップや正規化 CSS などの外部ライブラリなど) を上書きする場合のみ、 !important を使用しましょう。
・決してプラグインやマッシュアップを書いている時に、 !important を使わないようにしましょう。
・決してサイト全体の CSS で !important を使わないようにしましょう。
- 詳細度 - CSS: カスケーディングスタイルシート | MDN
基本的には自身で管理できるCSSの範疇内では使わず、他の道を常に模索するべきという指針が述べられている
