Конкретный вопрос о специфике CSS
У меня есть очень специфический вопрос о специфичности CSS, который я не мог четко понять; http://coding.smashingmagazine.com/2007/07/27/css-specificity-things-you-should-know/
Если у меня есть 2 селектора, которые определяют непротиворечивые свойства / атрибуты, оба атрибута будут по-прежнему применяться ИЛИ как он работает, он просто сравнивает селекторы, не беспокоясь о том, что определено внутри них.
Так что, если у нас есть;
.menu1 {color:red}
p.menu1 {font-size:10px}
Здесь оба селектора ссылаются на "menu1", но определяют несвязанные атрибуты (цвет / размер шрифта)
Итак, мой вопрос: специфичность все еще имеет значение, и будет рассматриваться только 1 из 2? Мой вопрос больше о том, как происходит фактическая реализация.
2 ответа
Нет, в этом случае специфика не имеет значения, так как вы просто добавляете дополнительное свойство к menu1 класс, который не меняет существующие правила. Однако, если вы измените порядок правил и попытаетесь переопределить color:
p.menu1 {color:blue}
.menu1 {color:red}
тогда менее конкретное правило .menu1 {color:red} не будет переопределять более конкретные p.menu1 {color:blue}даже если "красное" правило появляется после "синего" правила (попробуйте).
Конечно, если вы измените второе правило на p.menu1 {color:red} оно будет переопределено, поскольку эти два правила будут иметь одинаковую специфику.
В обзоре статьи пункт 11 гласит:
11. Последнее определенное правило переопределяет любые предыдущие противоречивые правила.
(где "последнее правило" может быть заменено "последним или наиболее конкретным правилом")
Так что если есть разные свойства, то ничего не переопределяется. Два правила объединены, поэтому p.menu1 все будут иметь размер шрифта 10 пикселей и будут красного цвета. Второе правило по-прежнему имеет более конкретный селектор, но оно просто не актуально, пока вы не укажете общий стиль, который потенциально может быть переопределен.
То, как все это делается в реализации, хорошо, деталь реализации, так что я не знаю.