link 和 style 元素在 HTML 文档中的位置

对于 link 元素 和 style 元素 我相信大家都比较了解，但对于他们的出现位置可能有误解。

在 淘宝 的所有频道中出现这样一个问题：频道头部文件由于是统一支配的（为什么？历史原因！），所以我们无法在每个频道的 head 元素中以 link 或 style 方式加入各自的样式。最后选取了折中的方式，在主体内容中直接写入 style 元素，也就是说 style 元素置于了 body 元素中。

一切看着貌似很完美。其实不然，在 W3C 中对于 link 元素 和 style 元素 出现的位置有详细的说明：

HTML permits any number of STYLE elements in the HEAD section of a document.

The LINK element defines a link. Unlike A, it may only appear in the HEAD section of a document, although it may appear any number of times.

也就是说 link 元素 和 style 元素 必须出现在 head 元素中。

在下面的工作中，我们将会对页面中的这个错误进行优化，可能优化的进度不是理想中的速度（为什么？个人经验：历史原因的解决一向都不会很直接！）。

其实对于上面的问题，外国的开发人员有过相关讨论：

• 《Style Element within Body Tag》

• 《Style Sheet Link in Body Tag?》

如果想温习一下样式的引入，可参读：《Style Sheets in HTML documents》

如有你想知道如何优化样式加载方式，可参读：《页面中 CSS 加载方式的优化》