Відіграє роль у тому випадку, коли користувачі підключають власну таблицю стилів, також застосовується для підвищення специфічності стильового правила. Якщо виникає суперечність, коли стиль автора сторінки та користувача для одного і того ж елемента не збігається, то !important дозволяє підвищити пріоритет стилю.
При використанні таблиці користувача стилів або одночасному застосуванні різного стилю автора та користувача до одного і того ж селектора, браузер керується наступним алгоритмом.
- !important доданий до авторського стилю — буде застосовуватися стиль автора.
- !important додано до стилю користувача — буде застосовуватися стиль користувача.
- !important немає як в авторському стилі, так і в стилі користувача — буде застосовуватися стиль автора.
- !important міститься в авторському стилі та стилі користувача — буде застосовуватися стиль користувача.
Підсумок застосування !important в загальному випадку показаний в табл. 1.
Стиль автора | Стиль користувача | Результат | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
BODY {
/* Сірий колір тексту */ color: silver;
/* Розмір тексту 8 пунктів */ font-size: 8pt } | BODY {
/* Чорний колір тексту */ color: #000;
/* Розмір тексту 12 пунктів */ font-size: 12pt } | Lorem ipsum dolor sit amet... Застосовується стиль автора, а саме: встановлений сірий колір тексту, розмір шрифту 8 пунктів. | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
BODY {
/* Сірий колір тексту */ color: silver; /* Розмір тексту 8 пунктів */ font-size: 8pt } | BODY {
/* Чорний колір тексту, підвищена важливість */ color: #000 !important;
/* Розмір тексту 12 пунктів */ font-size: 12pt } | Lorem ipsum dolor sit amet... Колір тексту буде встановлений для користувача, а розмір шрифту залишиться вихідним. У результаті побачимо чорний текст розміром 8 пунктів. | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
BODY {
*/ color: silver;
/* Розмір тексту 8 пунктів */ font-size: 8pt } | BODY {
/* Чорний колір тексту, підвищена важливість */ color: #000 !important; /* Розмір тексту 12 пунктів, підвищена важливість */ font-size: 12pt !important } | 0); font-size: 12pt;">Lorem ipsum dolor sit amet... BODY {
/* Чорний колір тексту, підвищена важливість */ color: #000 !important; /* Розмір тексту 12 пунктів, підвищена важливість */ font-size: 12pt !important } | Lorem ipsum dolor sit amet... При додаванні !important в ту і іншу таблицю пріоритет у разі має стиль пользователя. В результаті текст стане чорним, а розмір його збільшиться до 12 пунктів.>Сервіс > Властивість оглядача > Оформлення, як показано на мал. 1. Мал. 1. Підключення стилю користувача до браузера Internet Explorer Коротка інформація
Синтаксис<code><i>Властивість</i>: <значення> !important Позначення
Приклад<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>important</title> <style> p { background: url(/example/image/tune1.png) no-repeat !important; min-height: 112px; /* Мінімальна висота */ padding-left: 65px; /* Поле зліва від тексту */ } p { background: url(/example/image/tune2.png) no-repeat; } </style> </head> <body> <p>Мінорна пентатоніка зі зниженим V щаблем також називається блюзовою пентатонікою.</p> </body> </html> У даному прикладі для одного селектора задається те саме властивість з різними значеннями. Але оскільки до першого селектора додається !important, його стиль і буде застосовуватися на сторінці. ПриміткаПри додаванні !important до значення стильової властивості його важливість підвищується. Якщо перевизначити значення тієї ж властивості без !important, воно ігноруватиметься браузерами. Але тільки не в Internet Explorer версії 6 і нижче. Специфікація
СпецифікаціяКожна специфікація проходить кілька стадій схвалення.
Браузери
БраузериУ таблиці браузерів застосовуються такі позначення.
|