Web 扩展:如何使用 "browser_style = true"?

Web Extension : How do I use "browser_style = true"?

在编写 Firefox 网络扩展时,可以为浏览器或页面操作使用默认 css,以便它们的样式与其他浏览器 UI 组件一样。这是通过插入完成的:

"browser_style": true

在扩展清单中。 panel-section-footer-button 等样式可用。

我的问题:你怎么知道如何使用默认样式,似乎没有关于它们的官方来源或描述?


相关:

使用 "browser_style": true 导致 chrome://browser/content/extension.css 文件 being applied to your HTML (on OSX chrome://browser/content/extension-mac.css 被应用。

Mozilla 有一个 Style Guide which you can peruse to see how various elements and classes are used. The link to this Style Guide is in the browser_style entry within the "Syntax" section of the browser_action documentation page. A similar link is in the same location on the page_action MDN documentation page。就个人而言,我认为将风格指南中包含的信息直接托管在 MDN 上而不是 firefoxux.github.io.

上更合适。

如果您只对元素和 类 感兴趣,可以在 Components section.

下找到示例

注意:在some conditions, Firefox also attempts to apply chrome://browser/content/extension-win-panel.csschrome://browser/content/extension-mac-panel.css 下都不存在。