Что делает трюк CSS * + html?

В проекте, с которым я работаю, я определил множество правил, подобных этому:

* + html {
    /.../
}

Я знаю, что делают * и +, но я не понимаю, в чем смысл этой конструкции?

Я также заметил это:

* html {
    /.../
}

Я не мог найти места, где они применяются.

AFAIK html уникален для каждой страницы, поэтому почему бы просто не использовать селектор html? Это какая-то магия?

Ответы

Ответ 2

Согласно определение селекторов W3C, "E + F" определяется как:

Соответствует любому элементу F, которому сразу предшествует элемент Sibling E.

Вы упомянули код:

* + html

Это должно соответствовать тегу html сразу после любого другого элемента. Но элемент html - это первый элемент (корневой элемент) html-страницы. Таким образом, перед тегом html нет элемента (т.е. HTML-тега), правило не соответствует ни одному элементу.

По крайней мере, для любого браузера, который правильно реализует стандарт. "Проблема" заключается в том, что IE7 не реализует ее правильно и применяет правила.

Другими словами, это CSS-хак для IE7.

Другой способ - использовать условные комментарии:

<!--[if lte IE 7]> <html class="ie7"> <![endif]-->

НТН