为 Firefox Mobile 设置 option_ui 和 browser_action 页面的样式

Question

我为 Firefox 开发了一个扩展，带有一个 选项弹出窗口 用于首选项。

在移动设备上，因为它不会作为弹出窗口打开，而是作为新标签打开 moz-extension://(...)/popup.html，我不得不应用一些特定的 CSS 媒体查询。

但是正如您在下面看到的，它肯定是行不通的。

我该怎么办？

CSS 页面在这里 https://github.com/ANN-MB/LEIA/blob/master/extension%20firefox/leia.css

Answer 1

但是您需要@media 查询来获得想要的解决方案！您的 Medium 提供了最大尺寸范围，您只需要在 diffents sizerranges 上声明您的样式：

@media(min-width:XXXpx) {
    // your style here
}

有关更多信息，请查看：https://gist.github.com/gokulkrishh/242e68d1ee94ad05f488

Answer 2

我解决了这个问题。

这与 媒体查询 无关，而是因为我的 manifest.json 看起来像这样：

"options_ui": {
    "page": "config.html",
    "browser_style": false,
    "open_in_tab": true
  }

似乎当 open_in_tab 设置为 true 时，Firefox 移动浏览器打开 选项页面 与桌面显示（不要问我为什么）。

所以将 "open_in_tab" 改为 false 给了我很好的渲染。