CSS-иерархия

Приоритет CSS — это иерархический приоритет всех CSS, назначенных тегам HTML.

Каковы приоритеты правил CSS, используемых для форматирования тегов HTML? Когда и в каких ситуациях используется понятие !important?

Концепции, влияющие на порядок приоритетов CSS

• Встроенный CSS (CSS применяется непосредственно к тегу)
• Внутренний CSS (CSS применяется между тегами <style></style> на одной странице.)
• Внешний CSS (CSS применяется извне (из пути к файлу или другого веб-сайта) с помощью тега <link>.)
• Class
• Id
• !important

Id > Class > HTML-тег

Какие свойства CSS, присвоенные тегам Class, ID и HTML, имеют приоритет?

Если HTML-тег имеет идентификатор, класс в качестве внутреннего типа CSS и правило CSS, которое применяется непосредственно к HTML-тегу, браузер применит порядок приоритета CSS ID > Класс > HTML-тег.

Встроенный > Внутренний > Внешний приоритет CSS

При применении внешних, внутренних и встроенных типов CSS приоритет CSS будет следующим: встроенный > внутренний > внешний на стороне браузера.

Примечание: Внешний код CSS можно увидеть на вкладке CSS.

Однако такая расстановка приоритетов применяется только в том случае, если каждый тип реализации CSS используется одинаково. Например, при использовании внешнего и внутреннего CSS оба должны применяться к тегу id или class или HTML, порядок приоритета также будет меняться в разных случаях.