Когда 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’ домашней странице показано с определенной пользователем стиль переопределения нормальный размер текста, который можно сделать � …

Если вы хотите прочитать полностью статью, посетите сайт наших спонсоров