有没有办法在某些条件下禁用媒体查询？
我在主站点以及站点的“预览”中使用相同的样式表（不在 iframe 中，因为我需要它具有交互性）。问题是，预览不会占用 100% 的屏幕宽度，因此当媒体查询基于屏幕尺寸时，页面的行为会很奇怪。不过，我可以将编辑器/预览模式设置为固定宽度，所以我想也许有某种方法可以在某些条件下禁用媒体查询？但我不知道如何解决这个问题。要么通过 JavaScript，要么可能在媒体查询之后加载一个额外的通用样式表，这会以某种方式重置内容。
否则，我可能必须制作备用样式表，这将很难维护，或者重新设计页面，使预览区域为宽度的 100%。
I am using the same stylesheet for the main site as well as a 'preview' of the site (NOT in an iframe because I need it to be interactive). The issues is, the preview does not take up 100% of the screen width, so when media queries are based on screen size, the page behaves oddly. I am ok with making the editor/preview mode fixed width, though, so I thought perhaps there is some way I can disable the media-queries under certain conditions? I have no idea how to approach that, though. Either through javascript, or potentially loading an additional, generic stylesheet after the mediaqueries that would somehow reset things.
Otherwise I may have to make alternate stylesheets, which would be a pain to maintain, or redesign the page so that the preview area is 100% of the width.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（3）
您有多种选择。
使用
，您可以在 onload 处理程序中运行此命令：document.getElementById("mediaSheet ").sheet.disabled = true;。?preview=true请求页面，则不会生成样式表元素。You've got a number of options.
with
<link id="mediaSheet" rel="stylesheet" href="....">, you may run this in your onload handler:document.getElementById("mediaSheet").sheet.disabled = true;.?preview=true, the stylesheet element will not be generated.将视口元设置为符合媒体查询的特定宽度。
确保您的比例设置正确。如果您希望移动设备能够看到桌面版本，我倾向于将其删除。
Set the viewport meta to be a certain width that complies with the media query.
Ensure you have the scale set correctly though. I tend to remove it if you want a mobile to be able to see the desktop version.
就像添加到A.Pavlov的答案（我还不能添加评论）：
如果你想使用JQuery
或者如果你想禁用所有媒体查询，请使用class =“mediaSheet”而不是ID：
Just like to add to A.Pavlov's answer (I can't add comments yet):
If you want to use JQuery
Or if you want to disable all media queries, use class="mediaSheet" instead of ID: