响应式web设计中的单样式表与多样式表

简而言之：

在进行响应式web设计时，您应该使用一个还是多个样式表

详细信息：

在响应式设计中，您倾向于使用CSS的一个主要块，然后使用其他块来调整布局，当布局达到某些断点时。您可以通过以下两种方式之一构造代码：

单个样式表

/*主CSS*/
@仅媒体屏幕和（最小宽度：480px）{/*CSS*/}
@仅媒体屏幕和（最小宽度：640px）{/*CSS*/}
@仅媒体屏幕和（最小宽度：800px）{/*CSS*/}

多个样式表

&lt；link rel=“stylesheet”media=“screen”href=”https://stackoverflow.com/questions/8660241/main.css“&gt；
&lt；link rel=“stylesheet”media=“仅屏幕和（最小宽度：480px）”href=”https://stackoverflow.com/questions/8660241/480.css“&gt；
&lt；link rel=“stylesheet”media=“仅屏幕和（最小宽度：640px）”href=”https://stackoverflow.com/questions/8660241/640.css“&gt；
&lt；link rel=“stylesheet”media=“仅屏幕和（最小宽度：800px）”href=”https://stackoverflow.com/questions/8660241/800.css“&gt；

使用一个样式表似乎可以减少HTTP请求的数量，但您将拥有一个更大的文件，其中包含一些客户端可能不使用的代码。多个样式表似乎可以减小文件大小，但随后会有更多的HTTP请求

您应该在什么时候选择每种方法？HTTP请求数量和文件大小的利弊在实践中是如何叠加的