CSS

Специфичность селекторов идентификаторов и атрибутов

Важно отметить разницу в специфичности селектора идентификатора (ID selector) и селектора атрибутов (attribute selector), в котором указан атрибут id. Возвращаясь к третьей паре правил в примере кода, мы находим:

html > body table tr[id="totals"] td ul > li {color: maroon;} /* 0,0,1,7 */
li#answer {color: navy;} /* 0,1,0,1 (победитель) */


К общей специфичности селектор идентификатора (#answer) из второго правила добавляет 0,1,0,0. В то же время в первом правиле селектор атрибута ([id="totals"]) добавляет к значению специфичности 0,0,1,0. Таким образом, приведенные ниже правила определяют, что цвет элемента, значение атрибута id которого равно meadow, будет зеленым:

#meadow {color: green;} /* 0,1,0,0 */
*[id="meadow"] {color: red;} /* 0,0,1,0 */
Теги:
Специфичность
Добавлено: 17 Июля 2018 21:11:35 Добавил: Андрей Ковальчук Нравится 0
Добавить
Комментарии:
Нету комментариев для вывода...