我在主站点以及站点的“预览”中使用相同的样式表(不在 iframe 中，因为我需要它具有交互性)。问题是，预览不会占用 100% 的屏幕宽度，因此当媒体查询基于屏幕尺寸时，页面的行为会很奇怪。不过，我可以将编辑器/预览模式设置为固定宽度，所以我想也许有某种方法可以在某些条件下禁用媒体查询？但我不知道如何解决这个问题。要么通过 JavaScript，要么可能在媒体查询之后加载一个额外的通用样式表，这会以某种方式重置内容。
否则我可能必须制作备用样式表，这将很难维护，或者重新设计页面以使预览区域为宽度的 100%。
最佳答案
您有多种选择。
- 首先，您可以禁用“有问题的”样式表:
与
<link id="mediaSheet" rel="stylesheet" href="....">，您可以在 onload 处理程序中运行此命令:document.getElementById("mediaSheet").sheet.disabled = true;. - 如果您想编码，您可以有条件地将此链接添加到您的最终 HTML 中。例如。如果使用 GET 参数请求页面
?preview=true，将不会生成样式表元素。
关于javascript - 有没有办法在某些条件下禁用媒体查询？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/7583441/