Иногда важность объявления настолько велика, что перевешивает все остальные факторы. CSS2.1 называет их (по вполне понятным причинам) важными объявлениями (important declarations) и предоставляет вам возможность отмечать их путем введения в объявление ключевого слова !important прямо перед завершающей точкой с запятой:
p.dark {color: #333 !important; background: white;}
Здесь значение цвета #333 отмечено как !important, тогда как цвет фона white – нет. Если вы хотите сделать важными оба объявления, каждому из них понадобится собственный маркер !important:
p.dark {color: #333 !important; background: white !important;}
Необходимо правильно размещать !important, иначе объявление будет признано недействительным. Ключевое слово !important всегда располагается в конце объявления, прямо перед точкой с запятой. Это особенно важно, когда дело доходит до свойств (например, font), значения которых могут состоять из нескольких ключевых слов:
p.light {color: yellow; font: smaller Times, serif !important;}
Если бы !important было расположено где-либо в другом месте объявления font, то все объявление было бы признано недействительным и ни один из его стилей не был бы применен. Объявления, отмеченные как !important, не имеют особого значения специфичности, они рассматриваются отдельно от остальных. Фактически все объявления !important группируются вместе, и тогда уже их конфликты специфичностей разрешаются относительно друг друга. Аналогично группируются все остальные объявления, и конфликты свойств разрешаются с помощью специфичностей. В любом случае, когда имеет место конфликт важного и неважного объявления, всегда побеждает важное.
Применения следующих правил и фрагмента разметки:
h1 {font-style: italic; color: gray !important;}
.title {color: black; background: silver;}
* {background: black !important;}
<h1 class="title">NightWing</h1>