Web扩展程序:如何使用& quot; browser_style = true& quot ;? [英] Web Extension : How do I use "browser_style = true"?
问题描述
编写Firefox Web扩展程序时,可以对浏览器或页面操作使用默认的CSS,以使其样式类似于其他浏览器UI组件.通过插入:
When writing a Firefox web extension it's possible to use a default css for browser or page actions so that they are styled like other browser UI components. It's done by inserting:
"browser_style": true
扩展清单中的
.可以使用 panel-section-footer-button
之类的样式.
in the extension manifest. Styles like panel-section-footer-button
become available.
我的问题:您怎么知道如何使用默认样式,似乎没有官方的来源或描述?
My question: How can you know how to use the default styles, there doesn't seem to be an official source or description of them?
相关:
-
内置资源
chrome://browser/content/extension.css
中的CSS.
This popup example on Mozilla site, which uses some default styles..
推荐答案
使用"browser_style":true
会生成 chrome://browser/content/extension.css
>文件已应用于您的HTML(在OSX上 chrome://browser/content/extension-mac.css
代替).
Using "browser_style": true
results in the chrome://browser/content/extension.css
file being applied to your HTML (on OSX chrome://browser/content/extension-mac.css
is applied instead).
Mozilla有一个样式指南,您可以仔细阅读该指南以了解各种元素和类的方式被使用.该样式指南的链接位于 browser_action
文档页面的语法"部分中的> browser_style 条目.在 page_action
MDN文档页面.就个人而言,我认为将样式指南中包含的信息直接托管在MDN而不是 firefoxux.github.io
.
Mozilla has a 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. Personally, I would find it more appropriate for the information contained in the Style Guide to be hosted directly on MDN rather than on firefoxux.github.io
.
如果您仅对元素和类感兴趣,可以在组件"部分下找到示例.
If you are just interested in the elements and classes, you can find examples under the Components section.
注意:在有些条件,Firefox也尝试申请 chrome://browser/content/extension-win-panel.css
或 chrome://browser/content/extension-mac-panel.css
都不存在.
Note: Under some conditions, Firefox also attempts to apply chrome://browser/content/extension-win-panel.css
or chrome://browser/content/extension-mac-panel.css
neither of which exist.
这篇关于Web扩展程序:如何使用& quot; browser_style = true& quot ;?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!