Приоритет стилей css important
Добрый день коллеги, вчера мы с Вами рассматривали довольно интересную и полезную тему, где обсуждали приоритеты стилей css. В этом мы замечательно разобрались, но Вы со мной согласитесь, что иногда нужно задать более высокий приоритет для определенного стиля, и как это сделать, Вы узнаете из данного урока. Существует такое значение, под названием !important, при добавлении которого приоритет данного свойства всегда будет выше по отношению к другим. Давайте рассмотрим все это на примере.
p {
font-size: 30px !important;
}
#content .header p {
font-size: 20px;
}
Смотрите, допустим, у нас есть общий блок с id content, и находящийся в нем блок header, внутри которого находится абзац. При помощи
данных селекторов мы пытаемся установить размер шрифта для данного абзаца равным 20 пикселей, но при этом мы в самом начале установили, что для всех
абзацев размер шрифта должен быть равен 30 пикселей, и установили для данного свойства, значение !important. Как видите изменить шрифт
с 30 пикселей, на 20 нам не удалось, все благодаря значению !important, которое повысило приоритет у нашего свойства. Пример, конечно, не очень логичный,
однако он полностью отражает суть работы изучаемого значения. Думаю, теперь Вы найдете в каких ситуациях можно его применять.
И сегодня я хотел бы уточнить один момент. Из вчерашнего урока можно сделать вывод, что 10 классов по приоритету должны быть равны одному идентификатору,
но на практике это не так, и одному идентификатору соответствует 256 классов. Это нужно запомнить. Но я не думаю, что Вы будете писать хотя бы
5 классов, не говоря о 10 и тем более 256. На этом можно завершать тему приоритетов стилей сss, до скорых встреч.
