你如何使用firefox Extensions来改变网站的CSS?

时间:2014-01-02 08:09:40

标签: firefox firefox-addon

我正在寻找为个人和个人朋友使用创建扩展程序,只是更改我访问的网站上显示的一些颜色。

我想知道如何编辑或注入CSS代码到这个网站,以便网站中使用的颜色是我希望他们查看页面时的颜色。请注意,这当然只是在我的浏览器或使用我的扩展程序的另一个Firefox浏览器中。

3 个答案:

答案 0 :(得分:3)

我认为ypunare正在寻找如何使用firefox扩展将样式注入网页 你可以尝试这种方式

pageMod.PageMod( {
  include: '*',
  contentStyleFile: [
    data.url( 'style1.css' ),
    data.url( 'style2.css' )
  ]
})

请参阅https://developer.mozilla.org/en-US/Add-ons/SDK/High-Level_APIs/page-mod

答案 1 :(得分:2)

SDK通过PageMod.contentStyleFile/.contentStyle提供类似的内容。

当然,您始终可以使用DOM API创建或链接新样式(.createElement<style>和/或<link rel="stylesheet">)或为每个元素指定样式( Element.style.)。使用DOM API是可能的,例如通过SDK页面工作者,或在常规的非SDK XUL覆盖附加组件中,例如直接访问contentWindow标签页。

或使用nsIStyleSheetService注册全局样式表,例如完整的Stylish附加功能确实是IIRC。

正如您所看到的,您的问题有点广泛,因此我不会深入了解我给出的每个替代方案的细节。一旦你得到一些实际的代码,请随意发布其他问题......

答案 2 :(得分:1)

Both the other answers seem to use the use of legacy Add-In SDK methods, so I will update this to include information about the new standard "Web Extensions".

To add inject CSS into the page, you can do it straight from the manifest.json file. Use the content_scripts section of the file and the stylesheets under css. Documentation can be found at https://developer.mozilla.org/en-US/Add-ons/WebExtensions/manifest.json/content_scripts