Middle
CSS valijate spetsiifilisus: millised stiilid rakenduvad kahe H2 sildile, mille stiilid on konkurentsivõimelised? Järjesta valijad kasvava spetsiifilisuse järgi.
sobes.tech AI
Vastus AI-lt
Специфичность CSS-селектора определяется по правилам:
- Inline-стили (style="...") — самая высокая специфичность.
- ID-селекторы (#id) — высокая специфичность.
- Классы (.class), псевдоклассы (:hover), атрибуты ([type="text"]) — средняя специфичность.
- Теги (h2, div) и псевдоэлементы (::before) — низкая специфичность.
Если у двух тегов H2 есть конкурирующие стили, применится стиль с более высокой специфичностью. Если специфичность равна, то применяется последний по порядку в CSS.
Пример расположения селекторов по возрастанию специфичности:
h2 { color: blue; } /* 0,0,0,1 */
.className h2 { color: green; } /* 0,0,1,1 */
#uniqueId h2 { color: red; } /* 0,1,0,1 */
style="color: yellow;" /* inline-стиль, самая высокая специфичность */
В итоге, если у двух H2 есть стили с селекторами h2 и #uniqueId h2, применится стиль с ID-селектором.