Должен ли <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/...

Ответ 8

В соответствии со спецификацией HTML 5.2 (в черновике) тег стиля разрешен только в заголовке документа.

HTML 5.2 Черновик на теге стиля (18 августа 2016 г.)

Элемент стиля ограничен появлением в голове документ.

Ответ 9

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

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

Ответ 10

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