如何正确地对 Chrome 窗口的宽度进行媒体查询?甚至可以在 Chrome 扩展中正确地进行媒体查询吗?
现在,我的媒体查询作用于扩展程序视口(viewport)的宽度,而不是实际浏览器的视口(viewport)(并且扩展程序的视口(viewport)可以大于浏览器的)。在普通的网络应用程序中,视口(viewport)宽度始终等于浏览器的视口(viewport),但对于扩展程序来说似乎并不相同
似乎有一种方法可以通过设置“html”标签的宽度来使用 JavaScript 来实现这一点,但是如果有一种纯 CSS 方法会更可取
(这是用于带有弹出式 UI 的浏览器操作扩展)
最佳答案
至少在浏览器action popup中,纯CSS是不可能查询到父窗口的宽度的。正如我所想并且@Xan 在评论中确认的那样,JavaScript 是获取父窗口宽度所必需的。
可在此处找到使用 JavaScript 执行此操作的方法:How to get notified on window resize in chrome browser .请注意,这确实需要一个内容脚本,因为 chrome.window.onResized 自 2010 年以来仍然是一个悬而未决的问题
关于CSS - Chrome 扩展弹出窗口中的媒体查询,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26445989/