一切的样式表

Question

我想为所有内容加载 CSS 文件。 对于元素：选项卡、侧边栏、标签、窗口、选项、开发人员工具等。 我需要这个来改变滚动条。

如何在 Firefox addons-sdk 中实现？

Answer 1

你所说的一切实际上是指浏览器区域。所以你要做的就是在@-moz-document url("chrome://browser/content/browser.xul") {和}的括号内写CSS。否则 CSS 会影响网页内的东西。

在 CSS 表单中加载有两种方法，一种是使用nsIStyleSheetService，一种是使用 window.loadSheet.

window.loadSheet 是推荐的方式。你会这样做：

function registerWindows() {
    var _uri = Services.io.newURI("chrome://aus-view/skin/toolbar.css", null, null);
    aWindow.QueryInterface(Ci.nsIInterfaceRequestor).getInterface(Ci.nsIDOMWindowUtils).loadSheet(_uri, 1);
}


function unregisterWindows() {
    var _uri = Services.io.newURI("chrome://aus-view/skin/toolbar.css", null, null);
    aWindow.QueryInterface(Ci.nsIInterfaceRequestor).getInterface(Ci.nsIDOMWindowUtils).removeSheet(_uri, 1);
}

您必须确保将工作表加载到新打开的窗口中。

使用 nsIStyleSheetService，您只需 loadAndRegisterSheet，然后您就不必担心窗口的打开和关闭。但我听到的性能更难。不过我不知道这个表演的来源。

Cu.import('resource://gre/modules/Services.jsm');
var sss = Cc['@mozilla.org/content/style-sheet-service;1'].getService(Ci.nsIStyleSheetService);
var cssUri = Services.io.newURI('chrome://content/path/to/your/file.css', null, null);
sss.loadAndRegisterSheet(cssUri, sss.USER_SHEET);

然后，当您想删除它时，您只需：

sss.unregisterSheet(cssUri, sss.USER_SHEET);

现在这两个都使用了文件。您可以创建一个没有任何文件的 URI，如下所示：

var css = '';
css += '* { background-color: red; }';
css += '*.hover { background-color: blue; }';
var cssEncoded = encodeURIComponent(css);
var cssEncodedWithDataURL = 'data:text/css,' + cssEncoded 

然后我们以相同的方式创建我们的 URI：var cssUri = Services.io.newURI(cssEncodedWithDataURL, null, null); 然后您只需以相同的方式加载 stylehseet。 （使用第二种方法的示例：sss.unregisterSheet(cssUri, sss.USER_SHEET)）