这是我的问题。
我正在使用Google Page Speed Insights分析我的网页。 它告诉我删除头部（浮动线上方）的css链接，因为它阻止了我的页面加载。
现在我在文档的头部有一个简单的链接：
<link rel="stylesheet" media="all" href="http://mydomain.we/css/my.css" />
</head>
我尝试将链接线放在文档的底部。就在页面结束之前。
<link rel="stylesheet" media="all" href="http://mydomain.we/css/my.css" />
</body>
Ran Insight再次。
Insight结果有两个标签。通过将css链接放在文档的en，我在移动选项卡上得分为100％。但是我仍然在计算机部件上得到相同的消息，就好像我放置它的主要部分仍然被加载到浮动线上方。我不明白，因为我可以看到页面在没有css的情况下加载了几秒钟。
所以我想知道加载我的CSS最好的方法是什么？
我应该在标题中放置样式标记吗？
我应该在元素上添加样式标记吗？ ＆lt; - 我宁愿没有。
那么加载我的CSS的最佳方式是什么？
感谢。
答案 0 :(得分：2)
可能重复："Eliminate render-blocking CSS in above-the-fold content"
你应该保持你的CSS原样。我从未见过它建议将CSS文件链接到头部以外的任何地方。 Google Page Insights标准并不意味着它是最佳和最佳的方式，每个网站都不同。
最快的方法是使用<style>...</style>甚至内联CSS。但这并不意味着它是最好的做法。如果它只是几行CSS，你可以选择<style>方法，但如果只是为了获得一个完美的方法，我不会偏离你的方式Google Page Insights得分。
答案 1 :(得分：2)
恕我直言，Insight将始终考虑加载外部 CSS文件效率较低，因为来自Google Developers - OptimizeCSSDelivery
优化CSS投放
当PageSpeed Insights检测到页面包含渲染阻止外部样式表时会触发此规则，这会延迟首次渲染的时间。
对于小型CSS代码可能也是如此，但对于大型代码而言，这不是真的，这样做的另一个缺点是，如果您决定在CSS中更改某些内容，那么您需要转到每个页面并执行此操作改变而不是改变它。
此外，外部CSS文件可以缓存，与内联代码不同，同时考虑到网页大小会增加或每个页面，因为您将其内嵌在每个页面中。
我应该在元素上添加样式标记吗？ ＆lt; - 我宁愿不
从来没有！，这会给你很难维护和推广你的CSS，并且会有最优先考虑的问题，所以你会想到为什么要更改外部文件或{{1}中的CSS。部分没有生效。
答案 2 :(得分：1)
可能是for导致它，因为它用于识别所有媒体，其中media=all用于桌面。我会首先尝试使用media=screen，如果这不起作用，请尝试一起删除媒体标记。
答案 3 :(得分：1)
解决方法是首先识别并分离用于初始页面显示的CSS并将其移动到单独的文件中。
将此初始css文件加载到head部分，并将剩余的css移动到页面底部。