#div p {
color: red !important;
}
...
#div p {
color: blue;
}
Я понимаю, как работает !important, в этом случае div будет красным, потому что теперь он имеет приоритет (!important). Но я все еще не могу найти подходящую ситуацию для ее использования. Кто-нибудь знает какой-нибудь пример, где !important сохраняет день?
Представьте себе этот сценарий
В этом случае вы могли бы установить определенные стили в своем глобальном файле CSS как важные, таким образом, переопределяя встроенные стили, установленные непосредственно на элементах.
Этот сценарий обычно возникает, когда у вас нет полного контроля над вашим HTML. Подумайте о решениях в Sharepoint, например. Вы хотите, чтобы ваша часть была определена глобально (в стиле), но некоторые встроенные стили, которые вы не можете контролировать, присутствуют. !important облегчает работу с такими ситуациями.
Другие сценарии реальной жизни также включают некоторые плохо написанные плагины jQuery, которые также используют встроенные стили...
Я предполагаю, что вы получили эту идею к настоящему времени, а также можете придумать некоторые другие.
!important?Я предлагаю вам не использовать !important, если вы не можете сделать это иначе. Когда это возможно, избегайте этого. Использование большого количества стилей !important сделает техническое обслуживание немного сложнее, потому что вы нарушите естественное каскадирование в таблицах стилей.
Скажите в примере, что вы не можете изменить исходный код HTML, но предоставляете только таблицу стилей. Какой-то бездумный человек набросился на стиль непосредственно на элемент (boo!)
<div style="background-color:red">
<p>Take that!</p>
</div>
! Важно это переопределить.
<style>
div { background-color: green !important }
</style>
Это реальный сценарий реальный, потому что на самом деле это произошло вчера:
Альтернативы не использования !important в моем ответе:
!important.Таким образом, преимущество !important заключается в том, что он иногда экономит время. Если вы используете это очень экономно, это может быть полезным инструментом.
Если вы используете его только потому, что не понимаете, как специфика работает, вы делая это неправильно.
Другое использование для !important - это когда вы пишете какую-то внешнюю виджетную вещь, и вы хотите быть уверенным, что ваши стили будут применены, см.
Обычно вы используете! важно, когда у вас заканчиваются другие способы повышения специфичности селектора CSS.
Итак, если еще одно правило CSS уже использовало идентификаторы, пути наследования и имена классов, когда вам нужно переопределить это правило, вам нужно использовать "важный".
Мне нужно использовать !important, когда мне нужно переписать стиль HTML, созданный каким-то JS-плагином (например, рекламой, баннерами и т.д.), который использует атрибут style.
Итак, я предполагаю, что вы можете использовать его, когда вы не управляете css.
Строго говоря, вам не нужно использовать! важно, если вы хорошо структурировали свой CSS и не имеете слишком много степеней специфичности.
Самое подходящее время для использования! важно, когда у вас есть один исключительный стиль, который вы хотите создать за пределами обычного каскада вашего сайта.
!important несколько напоминает eval. Это не является хорошим решением любой проблемы, и есть очень мало проблем, которые не могут быть решены без него.
Использование !important обычно не является хорошей идеей в самом коде, но может быть полезно в различных переопределениях.
Я использую Firefox и плагин dotjs, который по существу может автоматически запускать собственный код JS или CSS на указанных веб-сайтах.
Здесь код для него, который я использую в Твиттере, который делает поле ввода твитов, всегда остается на моем экране независимо от того, как далеко я прокручиваю, и для гиперссылок всегда остается одного цвета.
a, a * {
color: rgb(34, 136, 85) !important;
}
.count-inner {
color: white !important;
}
.timeline-tweet-box {
z-index: 99 !important;
position: fixed !important;
left: 5% !important;
}
Поскольку, к счастью, разработчики Twitter не используют свойства !important много, я могу использовать его, чтобы гарантировать, что указанные стили будут определенно переопределены, потому что без !important они иногда не были переопределены. Мне это действительно пригодилось.
Это пример реального мира.
Во время работы с GWT-Bootstrap V2 он добавит некоторый файл css, который переопределит стили css. Чтобы мои свойства не были переопределены, я использовал !important
Использование !important очень важно при создании электронной почты, когда inline CSS является правильным ответом. Он используется вместе с @media для изменения макета при просмотре на разных платформах. Например, как выглядит страница на рабочем столе по сравнению с смартфонами (т.е. Измените расположение и размер ссылки), чтобы вся страница соответствовала ширине 480px в соответствии с шириной 640px.
Я использую! важно изменить стиль элемента в веб-части sharepoint. Javascript, который строит элементы в веб-части, зарывается на многие уровни в глубинах внутренней обработки sharepoint. Попытка найти, где применяется стиль, а затем пытаться изменить его, кажется, очень много потраченных на меня усилий. Использование важного тега в пользовательском файле CSS намного проще.
Вы используете !important для переопределения свойства css, например, у вас есть элемент управления в asp.net, и он отображает элемент управления с синим фоном (в html), и вы хотите изменить его, и вы не у вас есть исходный элемент управления, поэтому вы присоединяете новый файл css и записываете один и тот же селектор и меняете цвет и после его добавления важно.
Лучшие практики - это когда вы рекламируете/перепроектируете сайты SharePoint, которые вы его используете, чтобы переопределить стили по умолчанию
! important часто полезно для подметания глобальных операторов - например, изменение всех цветов фона на белый в таблице стилей печати.