我注意到如果我将<style>放在<body>内，css将应用于<style>标记之后和之前的所有元素。
所以在我看来，css是在页面加载时处理的，其行为类似于javascript文档就绪事件。我说得对吗？如果这是处理多个<style>标记的顺序？
最佳答案
TL；博士：
简而言之，你的问题的答案是：一旦标签在<style>内被满足，所有的东西都停止了，CSSOM正在被重建并重新应用到所有现有渲染的（绘画）内容。
在<body>内放置<style>标记被认为是一种不好的做法，因为它可以创建FOUC。但是，如果您的<body>标记只包含放置在DOM中元素之后的元素的规则，那么将其放置在body中就很好了，因为不可能发生FOUC。
页面的呈现过程相当复杂。但是，过于简单了，下面是<style>被读取，CSSOM被构建。除非使用<head>查询显式指定，否则所有CSS都是呈现阻塞。非阻塞的CSS仍然被加载，它并没有被完全跳过。
DOM构建和CSSOM构建是并行运行的，但是所有@media的执行都会推迟到CSSOM构建完成（在<script>标记met上），此时所有加载的</head>都会运行，从而阻塞DOM构建。JS此时可以对CSSOM进行更改。*
在<script>中放置<style>标记会中断一切（JS执行和DOM构建），CSSOM正在更新并应用于已经呈现的内容（如果有的话）。之后一切都恢复了。
*在进一步的测试中，似乎<body>解析是单线程的。CSSOM构建确实阻止了javascript的执行，但它是分阶段完成的，因为每个<head>和<link />标记都符合要求（放置在<style>之后的<script>只有在<link>被解析并应用到CSSOM之后才会执行）。<link />放置在CSS资源之间的标记不会延迟，直到<script>中的所有CSS资源都被解析，正如我最初所想的那样。
当然<head>可以在运行时对CSSOM进行更改。参见this question我要求了解CSSOM building如何阻止js执行的更多信息。
所有这些都适用于正常加载，而不考虑js，这给它增加了一个全新的复杂层次。
如果你对更多细节感兴趣，我建议你浏览一下Google提供的Web基础知识的Performance一章。