CSS 媒体查询有多慢？

Question

当我组织我的 CSS 时，我喜欢完全保留相关的样式（页眉样式在一个部分，页脚样式都在同一个地方，等等）（对不起，OOCSS 倡导者）。

我最近一直在尝试针对更小/更大屏幕的媒体查询。为了与我的组织方案保持一致，我必须在代码的每个部分中包含针对每个屏幕尺寸的单独查询。 （例如，如果我支持七种不同的屏幕尺寸，我的“标题”CSS 将有七个不同的媒体查询，然后在“页脚”部分有七个查询等）

撇开我是否应该这样做应该的问题不谈，拥有如此多的媒体查询块是否有任何技术后果？ （它们都是min-width、max-width，或两者兼而有之。假设我有 100 个不同的查询，但我一遍又一遍地检查只有七个不同的大小。）浏览器解析会花费更长的时间吗？

Answer 1

处理潜在慢速路径的代码在现代浏览器中得到了高度优化，因此您不需要预先优化此类事情，除非您必须使用手头的分析数据。继续写吧。