Question

<link>中的<script>或<meta>或<head></head>标记的订单是否完整无关？

（愚蠢的问题，但直到现在我从未考虑过的其中一件事。）

Answer 1

<强>优化

根据Yahoo!的人们的说法您应put CSS at the top和scripts at the bottom，因为脚本会阻止并行下载。但这主要是优化问题，对于实际工作的页面并不重要。 Joeri Sebrechts指出Cuzillion是一种很好的方法来测试这一点并看到自己的速度提升。

多个样式表

如果您要关联多个样式表，则它们的关联顺序可能会影响您的网页样式，具体取决于specificity of your selectors。换句话说，如果您有两个样式表以两种不同的方式定义相同的选择器，后者将优先。例如：

样式表1：

h1 { color: #f00; }

样式表2：

h1 { color: #00f; }

在此示例中，h1元素将具有颜色#00f，因为它最后以相同的特异性定义：

多个脚本

如果您使用多个脚本，如果其中一个脚本依赖于另一个脚本中的某些脚本，则它们的使用顺序可能很重要。在这种情况下，如果脚本以错误的顺序链接，您的某些脚本可能会抛出错误或无法按预期工作。但是，这很大程度上取决于您使用的脚本。

Answer 2

接受的答案有点错误，具体取决于文档的编码。如果HTTP头中没有发送编码，则浏览器必须从文档本身确定编码。

如果文档使用<meta http-equiv="Content-Type" …声明来声明其编码，则在此声明之前出现的任何ASCII值字符（字符代码<128）必须为ASCII值，如每HTML 4 spec。因此，在任何可能包含非ASCII字符的其他元素之前发生此meta声明非常重要。

Answer 3

建议使用尽可能高的字符编码元标记。如果编码未包含在请求页面的响应头中（或不同），则浏览器将不得不猜测编码是什么。只有当它找到这个元标记时，它才知道它正在处理什么，并且它必须读取它已经再次解析的所有内容。

Answer 4

需要注意的一件重要事项是：如果您使用Internet Explorer meta X-UA-Compatible标记来切换IE的渲染模式，那么它必须是HEAD中的第一件事：

<head>
  <meta http-equiv="X-UA-Compatible" content="IE=7" />
  <title>Page title</title>
  ...etc
</head>

Answer 5

元无关紧要，但链接（对于CSS）和脚本很重要。

脚本将阻止大多数浏览器呈现页面，直到加载脚本为止。因此，如果可能的话，不要把它们放在头部，而是身体。

css链接不会阻止页面呈现。

Answer 6

通常建议尽可能让<script>标记位于页面下方（不是在头部，而是在正文中）。

除此之外，我认为它没有多大区别，因为除非您完全加载<head>部分，否则无法解析正文。并且，您希望您的<link>标记位于头部，因为您希望在浏览器呈现页面时发生样式，而不是在此之后！

Answer 7

如果在meta元素中声明charset，则应该在任何其他元素之前执行。

Answer 8

根本不是一个愚蠢的问题由于已经提到的原因，脚本标签上面的CSS。

CSS按照您放置标记的顺序应用 - 样式表越具体，它应该是顺序越低。

脚本也一样 - 在加载依赖项之后，应该加载使用在其他文件中声明的函数的脚本。

Answer 9

将声明charset的元标记作为head中的第一个元素。浏览器目前只搜索标签。如果你在meta元素之前有太多东西，那么charset可能不会被应用。

如果您使用BASE元素，请将其放在任何加载URI的元素之前（如果需要）。

Answer 10

只有其中一个链接文件（CSS / Javascript）依赖于另一个文件才有意义。在这种情况下，必须首先加载所有依赖项。

比如说，你正在加载一个jQuery插件，然后你需要先加载jQuery本身。如果你有一个CSS文件，其中包含一些扩展其他规则的规则。

Answer 11

正如已经指出的，元描述内容字符集应该是第一个，否则它实际上可能是某种情况下的安全漏洞。（对不起，我不记得那里的情况应该在这里描述，但在网络安全培训课程中我已经得到了证明）

Answer 12

我最近遇到了一个可拖动的jquery ui元素的问题。它在Firefox中表现得很好，但不是Safari。经过大量的试验和错误，修复是将我的CSS链接移动到头部的javascript链接之上。非常奇怪，但现在将成为我的标准做法。

Answer 13

为了验证XHTML，是的。否则你可能会关心优化答案。

Answer 14

不，没关系，除了CSS链接或包含，因为CSS继承以及它覆盖已经设置的内容（对不起我的英语，我觉得我的句子不是很清楚： - /）