Свойство CSS !important

Поддержка браузерами

Браузеры для ПК
Internet Explorer Chrome Opera Safari Firefox Edge
5+ 1.0+ 3.5+ 3.0+ 1.0+ Да
Браузеры для планшетов и мобильных устройств
Android webview Chrome для Android Edge Mobile Firefox для Android Opera для Android iOS Safari Samsung Internet
Да Да Да Да Да Да Да

Краткая информация

Значение по умолчанию Нет
Наследуется Нет
Применяется Ко всем элементам
Аналог HTML Нет
Реализация в javascript Добавление стиля непосредственно самому элементу
document.getElementById('idElement').style.border = '1px solid red';
в данном случае элементу с id='idElement' будет добавлен стиль
border:1px solid red
Результат будет следующтй, допустим id='idElement' имеет тег div, тогда:
<div id="idElement" style="border:1px solid red">...</div>
Реализация в jQuery Добавление стиля непосредственно самому элементу
$('#idElement').css('border','1px solid red');
в данном случае элементу с id='idElement' будет добавлен стиль
border:1px solid red
Результат будет следующий, допустим id='idElement' имеет тег div, тогда:
<div id="idElement" style="border:1px solid red">...</div>

Поддерживающие версии CSS

CSS 1 CSS 2 CSS 2.1 CSS 3

Описание

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

Свойство !important не наследуется дочерними элементами и может применяться к любым свойствам CSS.

Синтаксис

Свойство: значение !important

Например:

... background: #ffb920 !important; border: #000000 solid 1px !important; padding: 20px !important; text-align: center !important; font-size: 16px !important; font-weight: bold !important; ...

Значения

У этого свойства отсутствуют значения

Пример

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Пример использования свойства !important</title> <style> div {/*Первый стиль*/ background: #ffb920 !important; border: #000000 solid 1px; padding: 20px; } div {/*Второй стиль*/ background: #3131f7 ; } </style> </head> <body> <div> В этом блоке показан пример использования свойства !important.<br> К тегу div применено два свойства background в которых имеются противоречия:<br> - в первом случае фон задан цветом #ffb920<br> - во втором случае фон задан цветом #3131f7 </div> </body> </html>

Результат

В этом блоке показан пример использования свойства !important.
К тегу div применено два свойства background в которых имеются противоречия:
- в первом случае фон задан цветом #ffb920
- во втором случае фон задан цветом #3131f7