浏览器缓存不相关的媒体查询吗？

Question

在包含多个媒体查询部分的虚构样式表中，浏览器只会处理相关媒体查询中的规则，例如

@media screen and (max-width: 400px) {
    .container {
        width: 95%;
    }
}
@media screen and (max-width: 800px) {
    .container {
        width: 80%;
    }
}

.container在屏幕上的宽度为95％，最大宽度为400px。

我的问题是：即使max 400px的媒体查询是唯一相关的（在这个虚构的示例中），浏览器会缓存最大800px的媒体查询，即使它是无关紧要的，或者不？

Answer 1

浏览器可能缓存包含这些媒体查询的整个CSS文件，但浏览器不会缓存CSS文件的特定部分。

所以要回答你的问题，是的，浏览器可能会缓存媒体查询的非活动部分，因为它可能（并且可能会）缓存整个CSS文件。