Как интерпретировать HTML несколько имен классов в CSS-визуализации? Что W3C говорит об этом?

О атрибуте класса HTML, присвоенном двум или более именам классов, то есть

<tag class="a b">....</tag>

Я могу проверить его с помощью разных браузеров - см. тесты http://jsfiddle.net/PP9yf/1/ или this вопрос/ответ - и выведите правило здравого смысла:

используйте class="a", если он определен, или используйте class="b", если он определен, или используйте BOTH, если оба определены... И при использовании обоих, если они назначают одно и то же свойство, последнее определение CSS переопределяет другие.

Итак, мы можем интерпретировать, например, что class="a b" должен быть таким же, как class="b a".

Но это официальная интерпретация W3C?

Где стандарт W3C, который говорит это правило?


PS: Я начал с этого другого вопроса, но моя мотивация - это разработка программного обеспечения. Мне нужен этот нормативный ответ для разработки программного обеспечения, подобного emogrifier и т.д.

Пример: CssToInlineStyles нужна эта коррекция... Но нужна только "коррекция", если есть W3C standand, говорящий, что программное обеспечение неверно.

Ответ 1

Ваши выводы верны, и они являются официальными спецификациями W3C.

Два класса самого элемента имеют одинаковое "происхождение". Кроме того, селектора имеют одинаковый "вес". Поскольку эти и другие правила не определяют, какой стиль имеет приоритет, порядок таблицы стилей определяет отмену.

См. Каскадные таблицы стилей, уровень 1, пункт 3.2 для правила, которое указывает это. 3.2.1 - 3.2.4 не различают ни один из двух стилей. Это 3.2.5, которое преобладает.

Я приведу здесь правила, хотя вы можете прочитать документ, чтобы поместить их в контекст.

Конфликтные правила являются неотъемлемой частью механизма CSS. Чтобы найти значение для комбинации элементов/свойств, необходимо следовать следующему алгоритму:

  • Найти все объявления, которые относятся к рассматриваемому элементу/свойству. Объявления применяются, если селектор соответствует элементу в вопрос. Если объявления не применяются, используется унаследованное значение. Если нет наследуемого значения (это имеет место для элемента "HTML" и для свойств, которые не наследуются), используется начальное значение.
  • Сортировка деклараций по явному весу: объявления с надписью "! important" несут больше веса, чем немаркированные (нормальные) объявления.
  • Сортировать по происхождению: листы стилей автора переопределяют таблицу стилей читателя, которые переопределяют значения по умолчанию UA. Импортированный стиль лист имеет то же происхождение, что и таблица стилей, из которой она импортировать.
  • Сортировка по специфичности селектора: более конкретные селектора будут переопределять более общие. Чтобы найти конкретность, подсчитайте число атрибутов идентификатора в селекторе (a), количестве атрибутов CLASS в селекторе (b) и количестве имен тегов в селекторе (c). Объединение трех чисел (в числовой системе с большой базой) дает специфику.
  • Сортировка по указанному порядку: если два правила имеют одинаковый вес, последний указывает выигрыши. Рассмотрены правила в импортированных таблицах стилей быть перед любыми правилами в самой таблице стилей.

Подведение итогов

Мы можем перевести правило здравого смысла в правило W3C CSS1 3.2 itens,

  • "используйте class=" a ", если он определен, или используйте class=" b ", если он определен, или используйте ОБА, если оба определены" эквивалентно 3.2.1, " Объявления применяются, если селектор соответствует соответствующему элементу".

  • "последнее определение CSS переопределяет другие" эквивалентно 3.2.5, " последний заданный выигрыш".

Не меняются с новыми стандартами: CSS2, CSS2.1 и CSS3 используют те же правила.