工具栏按钮类似于Firefox的后退/前进按钮-XUL

Question

我正在开发Firefox插件。 我需要创建两个按钮，它们的外观和操作与后退和前进按钮一样。 但是区别是我需要在其中放入自己的图标。 我完全空白。 任何方向都将非常有帮助。

[编辑]我要求在Windows环境下的最新Firefox中创建两个具有后退/前进按钮外观的按钮（尽管有两个按钮，但看起来像一个按钮）。

谢谢。

Answer 1

将自己的图像添加到工具栏按钮真的很容易。 阅读这些链接，您将得到答案，并且不要忘记为CSS文件中的按钮链接图像。

https://developer.mozilla.org/en/XUL_School/Adding_Toolbars_and_Toolbar_Buttons

https://developer.mozilla.org/en/XUL_Tutorial/Toolbars

https://developer.mozilla.org/en/CSS/-moz-border-image

https://developer.mozilla.org/en/custom_toolbar_button

https://developer.mozilla.org/en/XUL/Toolbars/Creating_toolbar_buttons

例如：

<window id="main-window">
  <toolbox id="navigator-toolbox">
    <toolbar id="xulschoolhello-toolbar" toolbarname="&xulschoolhello.toolbarName.label;"
      accesskey="&xulschoolhello.toolbar.accesskey;"
      customizable="true" mode="icons" context="toolbar-context-menu" 
      defaultset="xulschoolhello-hello-world-button"
      insertbefore="PersonalToolbar" />
  </toolbox>
</window>

CSS文件：

 //LInk you image here//
    toolbarbutton.xulschoolhello-toolbarbutton,
    window:not([active="true"]) toolbarbutton.xulschoolhello-toolbarbutton,
    toolbar[iconsize="small"] toolbarbutton.xulschoolhello-toolbarbutton {
      list-style-image: url("chrome://xulschoolhello-os/skin/toolbar.png");
    }