Когда CSS1 specification был разработан в середине-конце 90-х годов, он представил !important
заявлений, которые помогли бы разработчикам и пользователям легко переопределить нормальное специфику при внесении изменений в их стилей.По большей части, !important
заявления остались теми же, только с одним изменением в CSS2.1 и ничего нового добавить или изменить в CSS3 спецификации в связи с этим уникальным declaration.
Let’ S взглянуть на , что именно эти виды деклараций все about, и когда, если вообще когда-либо, вы должны использовать them.
Краткое Введение в Cascade
Прежде чем мы перейдем !important
деклараций и точно, как они работают, let’ ы дать этому обсуждению немного из контекста.В прошлом Smashing Magazine покрыл CSS specificity в глубине, поэтому, пожалуйста, посмотрите на эту статью, если вы хотите подробного обсуждения CSS каскад и как специфика связей in.
Ниже в общих чертах о том, как любой CSS-стиля документа будет решить, какой вес придать различные стили он сталкивается.Это общее резюме cascade как описано в спецификации:
- Найти все заявления, которые применяются к элементу и property
- Применить стиль к элементу на основе значения и происхождения, используя следующий заказ, с первым пунктом в списке имеющих наименьший вес:
- Объявления от пользователей agent
- Объявления от user
- Объявления от author
- Объявления от автора с
!important
added - Объявления от пользователей с
!important
added
- Применить стиль основан на специфике, с более конкретным селектором “ winning” над более общими ones
- Применить стиль основан на том порядке, в котором они отображаются в таблице стилей (например, в случае ничьей, последний “ wins”)
С, что основная схема, вероятно, можно уже увидеть, как !important
деклараций весят, и какую роль они играют в каскаде.Let’ посмотрим на !important
Более detail.
Синтаксис и Description
!important
Декларация предоставляет возможность для стиля автора, чтобы дать значение CSS подробнее weight чем он, естественно, есть.Следует отметить, что фраза “! Важные declaration” является ссылкой на всей декларации CSS, включая имущество и ценности, с !important
Добавил (спасибо Брэд Czerniak за указаниеэто расхождение).Вот простой пример кода, который четко показывает, как !important
влияет на естественный путь, что стили применяются:
#example { font-size: 14px !important; } #container #example { font-size: 10px; }
В приведенном выше примере кода, элемент с идентификатором “ example” будет иметь текст размером в 14px, в связи с добавлением !important
.
Без использования !important
, есть две причины, почему второй блок декларации, естественно, должны иметь больший вес, чем первый: второй блок в конце таблицы стилей (т.е. it’ S перечисленных секунду).Кроме того, второй блок имеет более специфичности (#container
последующей #example
, а не только #example
).Но с включением !important
, первые font-size
правила теперь имеет более weight.
Некоторые замечания о !important
объявления:
- При
!important
впервые был введен В CSS1, автор правило, с!important
декларации состоялось больший вес, чем пользователь правило, с!important
декларации; для улучшения доступности, эта было отменено в CSS2 - Если
!important
используется на сокращенное свойство, это добавляет “ importance” для всех суб-свойства, которые сокращенное свойство represents -
!important
ключевое слово (или заявления) должны быть помещены в конце линии, непосредственно перед точкой с запятой, иначе это не будет иметь никакого эффекта (хотя пробел перед запятой won’ T разбить его) - Если по определенным причинам вы должны написать то же свойство дважды в одном блоке декларации, а затем добавить
!important
в конец первой, первой, будет иметь больший вес в любом браузере, кроме IE6 (это работаетIE6 только рубить, но doesn’ T утратит свою силу, CSS) - В IE6 и IE7, если вы используете другое слово вместо
!important
(например,!hotdog
), правила CSS будет по-прежнему уделяться лишний вес, в то время как другие браузеры будут игнорировать it
? Когда следует важный быть использованы
Как и с любой техникой, есть плюсы и минусы, в зависимости от обстоятельств.Поэтому, когда она должна быть использована, если вообще когда-либо?Here’ мой субъективный обзор потенциальных действительны uses.
Never
!important
__ декларации 30 | не должны использоваться, если они не являются абсолютно necessary после все другие возможности были исчерпаны.Если вы используете !important
из лени, чтобы избежать надлежащей отладки, или спешить проект до завершения, то you’ Re злоупотребления, и вы (или те, которые наследуют ваши проекты) будут страдать consequences.
Если вы включите его, даже скупо в таблицах стилей, вы скоро обнаружите, что некоторые части вашего стиля будет труднее поддерживать.Как уже говорилось выше, CSS свойство важности происходит естественным путем каскада и специфичность.При использовании !important
you’ повторное нарушение естественного flow ваших правил, предоставляя больший вес правила, которые заслуживают такого weight.
Если вы не используете !important
, то that’ SA признак того, что вы понимаете, CSS и дать надлежащуюпредусмотрительность в коде, прежде чем писать it.
Это, как говорится, старая поговорка “ Никогда не говори never”, безусловно, применимы и здесь.Таким образом, ниже приведены некоторые законного использования в течение !important
.
Помощи или тестирование Accessibility
Как уже упоминалось, пользователь может включать таблицы стилей !important
декларации, позволяющий пользователей с особыми needs придать вес конкретные правила CSS, которые помогут их способность читать и доступ content.
Специальные потребности пользователей можно добавить !important
для типографского свойства, такие как font-size
сделать текст больше, или цвет соответствующие правила для того, чтобы увеличить контраст веб-pages.
На экране захватить ниже, Smashing Magazine’ домашней странице показано с определенной пользователем стиль переопределения нормальный размер текста, который можно сделать …
Если вы хотите прочитать полностью статью, посетите сайт наших спонсоров