Должен ли <STYLE> находиться в <HEAD> документа HTML?

Строго говоря, теги style должны находиться внутри head документа HTML? Стандарт 4.01 подразумевает, что, но это явно не указано:

Элемент STYLE позволяет авторам поместите правила таблицы стилей в голову документ. HTML допускает любое число элементов STYLE в разделе HEAD документа.

Я говорю "строго говоря", потому что у меня есть приложение, которое помещает элементы стиля в тело, и все браузеры, которые я тестировал, похоже, используют элементы стиля. Мне просто интересно, действительно ли это законно.

Ответы

Ответ 1

style предполагается включить только в head документа.

Помимо точки проверки, одна из предостережений, которая может вас заинтересовать при использовании style в body, - это flash неровного содержимого. Браузер получит элементы, которые будут стилизованы после их отображения, что приведет к их смещению по размеру/форме/шрифту и/или мерцанию. Это, как правило, признак плохого мастерства. Как правило, вы можете уйти с помещением style в любом месте, где хотите, но старайтесь избегать его, когда это возможно.

В HTML 5 был добавлен атрибут scoped, который позволял включать теги style всюду в теле, но затем они удалили его снова.

Ответ 2

В то время как другие ответы верны, я удивлен, что никто не объяснил, где стандарты запрещают стили вне head.

На самом деле в разделе Элемент head (и в DTD):

<!-- %head.misc; defined earlier on as "SCRIPT|STYLE|META|LINK|OBJECT" -->
<!ENTITY % head.content "TITLE & BASE?">

<!ELEMENT HEAD O O (%head.content;) +(%head.misc;) -- document head -->

Да, я знаю. DTD трудно читать.

Это единственное место, где встречается элемент STYLE, поэтому неявно он недействителен в другом месте.

Ответ 3

В соответствии с последними спецификациями WhatWG и W3C, да, элементы style всегда должны находиться в head. Некоторое время спецификации включали атрибут scoped для элементов style, которые, если они присутствовали, позволяли им помещаться внутри элемента в теле, чтобы стилизовать только потомки этого элемента... но эта функция никогда не делала его реального браузера (по крайней мере, не обязательно, чтобы его можно было активировать с помощью флага разработчика) и был удален из обеих спецификаций из-за отсутствия интереса к разработчикам. Следовательно, элементы style теперь разрешены только в контекстах, разрешающих контент метаданных, который является только головкой.

(Хорошо, что это не совсем так - вы можете юридически помещать контент метаданных, включая элементы style, внутри элемента template внутри body, но это не будет действовать, если вы находитесь в браузере, поддерживающем шаблоны. Это действительно просто глупая техничность.)

WhatWG spec говорит следующее:

4.2.6. Элемент style

Categories:

Содержимое метаданных.

Контексты, в которых этот элемент можно использовать:

Где ожидается контент метаданных.
В элементе <noscript>, который является дочерним элементом <head>.

CTRL-Fing через одностраничная спецификация показывает, что единственным элементом, модель содержимого которого включает контент метаданных, является элемент head.

Между тем, последняя спецификация проекта W3C содержит точно такую ​​же формулировку, за исключением того, что они также перечисляют контент метаданных в модели контента template. (WhatWG концептуализирует template по-разному и перечисляет свою модель контента как nothing.)

Ненормативный индекс элементов в спецификации WhatWG подтверждает, что единственными допустимыми родителями для элемента style являются head или noscript. (Версия W3 того же индекса ошибочно заявляет, что содержимое потока может содержать элементы <style>, но это ошибка, введенная W3C во время удаления атрибута scoped. У меня запрос на растяжение, чтобы исправить его.)

Ответ 4

Они не должны выходить за пределы головы, но они все равно работают; хотя вы можете заметить быстрое мерцание. Сайт не должен проверяться с тегом стиля вне головы, но действительно ли это имеет значение? Кроме того, теги ссылок также работают вне головы, даже если они не предназначены.

Ответ 5

Как и в других ответах, они не должны быть там. Однако он не будет проверяться. Это может быть или не иметь значения в этом случае, но имейте в виду, что рендеринг html полностью зависит от браузеров. Из того, что я знаю, все используемые сегодня браузеры будут поддерживать его вне головы, но вы не можете гарантировать это для будущих браузеров и будущих релизов браузера.

Придерживайтесь стандарта, и вы более безопасны. Насколько безопаснее для очень дебатов.

Ответ 6

Тег стиля в любом месте, но внутри <head> не будет проверяться с помощью правил W3C.

Ответ 7

В соответствии с этим сайтом HTML5.1 (в черновике) и WHATWG позволяют тегу <style> помещаться в тело:

http://www.html.am/tags/html-style-tag.cfm

Он также, похоже, поддерживался браузерами довольно долгое время. В соответствии с этим ответом StackOverflow Firefox 3+, IE6 +, Safari 2+ и Chrome 12+ поддерживают его:

fooobar.com/questions/34326/...

Ответ 9

Рекомендация HTML5.2 W3C от 14 декабря 2017 года (а не предыдущий проект, упомянутый выше) теперь говорит, что вы можете включить <style>.

"В организме, где ожидается содержание потока". (раздел 4.2.6)

Ответ 10

Вы также можете использовать тег стиля внутри раздела head или body, а также вне html-тега (не рекомендуется использовать сторонний html). В проектах реального времени много раз вы можете видеть, что они используют тег стиля вне html-тега