我只想知道浏览器是加载还是跳过这些外部css文件
<link rel="stylesheet" media="screen and (max-device-width: 800px)" href="example.css" />
如果屏幕超过 800px 宽度，如果它加载文件，我该怎么做才能避免它？我不希望浏览器加载用户不需要的文件。
最佳答案
The browser will load all specified
<link>'s.
这是在服务器端完成的，而呈现适当的内容是在客户端完成的。
您可以在浏览器开发者工具 F12 的源代码下查看确切加载的内容。
如果您担心加载多个大样式表，有几种选择。
将大部分样式放在一个共享样式表中，然后针对不同尺寸的屏幕只使用较小的样式表，因为两者之间不应该有太大变化。
在页面加载后使用 JavaScript 动态加载适当的样式。参见 this link关于具体如何做到这一点 - Farley 很简单。
作为引用，这篇关于Different Stylesheets for different devices的文章CSS Tricks 值得一读
关于html - 浏览器是否在不需要时加载媒体样式表中的文件？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/44240783/