!important в CSS

Часто бывает, что люди, давно изучающие CSS, не имеют представления или не понимают до конца как работает директива !important в CSS. В этой статье я постараюсь описать её действие и показать пару примеров, такая статья так же пригодится тем, кто только начал изучать CSS.

Причины по которым вам вдруг понадобится эта директива на самом деле могу быть очень разнообразными. Наприме, у вас есть куча больших файлов со множеством стилей, вот вы пишите новый стиль для какого-то объекта, а он не работает как надо, потому что где-то его перекрывает другой стиль, который изменить вы не можете. Вариантов выхода из такой ситуации два - разбиратся что и где перекрывает и как то все это менять, второй выход - использовать директиву "!important".

Что делает !importnat? Она приказывает интерпретатору или проще говоря браузеру применять тот стиль, который указан как "!important".

Как использовать директиву !importnat? Для того, чтобы браузер понимал, что стиль нужно обязательно применить, нужно поместить эту директиву в свойствах атрибута, после всех свойств.

Вот пример:

p {color:#00ff00 !important;}
p {color:#ff0000;}

этот код окрасит текст во всех <p> элементах в зеленый цвет.