CSS样式表位于顶部还是底部？或如何解决空白页问题？

Question

我一直将样式表放在html的顶部（<head></head>之间）。据我了解，这是最佳做法。（例如http://stevesouders.com/hpws/css-bottom.php）

无论如何，最近我经历了不同的结果。相反，当test.css变慢时，以下代码将返回空白页，这意味着我没有进行渐进式渲染。

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="test.css" />
</head>
<body>
Blah..
</body>
</html>

然后将test.css放在底部时，我得到了渐进式渲染。

<!DOCTYPE html>
<html>
<head>
</head>
<body>
Blah..
<link rel="stylesheet" href="test.css" />
</body>
</html>

据目前为止我所了解和理解的，应该是相反的。可能还有其他我忽略的因素？

Answer 1

[Google正在迅速破坏头脑中“属于”样式的传统。他们确实确实建议关键样式属于<head>标记甚至是内联，但是在结束</html>标记之后应引用其他非必要样式。即使不是所有的现代浏览器，它也可以在大多数浏览器上运行（我还没有测试全部）。

Answer 2

6
投票

CSS应该在<head>中定义。

Answer 3

值得记住的是，尽管Internet Explorer不会使用@import缓存其他文件加载的CSS文件，但浏览器首次加载CSS文件时通常会缓存该文件。

Answer 4

0
投票

有争议的信息可以在互联网上找到。