如果我使用 CSS 媒体查询来应用 2 个不同的 CSS，例如 desktop.css 和 mobile.css，具体取决于我的最大宽度，这将如何实际工作？
浏览器是否会始终加载 CSS，然后在客户端应用实际的 CSS，或者浏览器是否智能足以仅加载相关的 CSS？
问问题
657 次
3 回答
2
只要您使用实际的媒体查询，所有 CSS 都会在页面加载时加载，因为这是所有支持媒体查询的浏览器的默认行为。在您到达这些断点或满足规则（如果您不使用断点媒体查询）之前，它不会应用 CSS。
如果您使用的是模仿媒体查询行为的 JavaScript，那么这完全是一个不同的球类游戏，并且取决于它是如何编写的，这取决于是否加载了 CSS。
代码示例将有助于确定一个有效的答案——但据我所知，你的第一句话是正确的；浏览器将始终加载您的所有 CSS，并且仅根据当时使用的视口/设备应用相关的内容。
于 2013-01-09T17:20:54.550 回答
0
这完全取决于您定义 CSS 的方式和位置。我将此页面作为基于不同媒体查询加载图像方式的参考。
但是，基本上，如果您根据媒体查询有条件地加载 CSS，那么在满足该媒体查询之前它不应该加载。
于 2013-01-09T17:14:58.790 回答
0
它加载所有 CSS 并通过正常的 CSS 层次结构应用它。
于 2013-01-09T17:10:15.373 回答