在移动网站中，将CSS放在<head>标签中是否好？

Question

4

移动站点中将CSS放在标签中好吗？因为这样不需要写和维护太多的CSS。

<head>
<style type="text/css">

css here...........

</style>
</head>

它将节省一个HTTP请求。我们可以为网站保留一个公共的header.php。

或者在移动网站上仍然将CSS保留在<head>中是一个不好的主意吗？

- Jitendra Vyas

无论是移动端还是非移动端，HTTP都是HTTP，因此在最佳实践中，CSS应该放在头部。 - Chris

5

@Chris，CSS的<style>块应该放在<head>中，但我认为@metal-gear-solid是在问整个样式表是否应该包含在文档的头部，而不是作为外部资源引用。 - David Thomas

3个回答

2

外部css可节省带宽，但我遇到过一些手机无法处理外部css的情况。如果您想覆盖更广泛的设备范围，这可能是一个好主意。

- nLL

2

我最近和我们的团队讨论了这个问题。我们的结论是将CSS嵌入HTML（而不是将它们作为单独的下载文件，并依靠过期头在手机上进行缓存）。我们考虑了以下几点：

针对@Bob提出的维护问题，我们将所有CSS文件保存在服务器上，并在生成HTML时将其注入（服务器端使用JSF）。如果您没有此选项，那么我同意Bob的看法-这将成为一个维护噩梦。

注意：我们的服务对象包括使用WIFI的智能手机用户（20%），使用3G/Edge网络的智能手机用户（40%）以及使用3G/Edge网络的功能手机用户（40%）。

- Kevin

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Jane Panda · Accepted Answer

我不建议这样做。虽然初始时你可以节省一个HTTP请求（请记住CSS文件已经被缓存），但是长期来看，我认为你会发现收益微乎其微（如果有的话），并且你会增加每个请求发送的额外文本。还需要考虑维护方面的问题。

根据移动设备上CSS数量/页面加载频率与ajax加载数据的比较，如果将CSS嵌入到HTML中，则可能能够在一定程度上节省加载时间，但这是具体情况具体分析的结果——安全起见，最好将CSS放置在一个文件中，并由浏览器自动缓存。

请查看该页面的HTML大小，其中超过一半是CSS。