Hintergrund der Toolbars mit userChrome.css

  • Hallo erstmal,

    ich hab mir heute erst den Firefox gezogen und bin absolut begeistert. Ich hab aber einige Frage bzgl. des Hintergrundes der Toolbar, den man ja mit der userChrome.css selbst einstellen kann. Ich verwende die folgende Syntax:

    menubar, toolbar, .tabbrowser-tabs {
    background-image: url("background.gif") !important;
    background-color: none !important;
    }

    Zunächst einmal wird die Statusleiste unten nicht miteinbezogen. Geht das irgendwie?

    Außerdem hätte ich gerne unter jeder "Zeile" der toolbars ein anderes Bild. Geht das irgendwie ? Ich habs schon geschafft, menubar, toolbar und eben .tabbrowser-tabs zu trennen. Ich will jedoch auch noch die einzelnen Zeilen der Toolbar trennen. Zudem erscheint ja, wenn man während des Surfens auf F3 drückt, unten im Fenster noch eine Suchleiste. Die hat, wie ich das gesehen habe, den gleichen Hintergrund wie die toolbar. Das würde ich auch gerne noch extra steuern.

    Grund für das ganze ist, dass ich gerne an meinen eigenen Skins rumbastle. Ich hab mir ein "gebürstetes Alu" gemacht und die Buttons sollen etwas "versenkt" aussehen. Hier mal ein Screenshot, bei dem man auch das Problem sieht, nämlich dass unter der Adressleiste die versenkten Umrandungen der Buttons wieder hervorschauen.

    [Blockierte Grafik: http://home.arcor.de/florian.baumer/screenshot.jpg]


    Danke schonmal für eure Hilfe

    Gruß

  • Zitat von newbee

    Zunächst einmal wird die Statusleiste unten nicht miteinbezogen. Geht das irgendwie?

    CSS
    menubar, toolbar, .tabbrowser-tabs, statusbar {
    background-image: url("background.gif") !important;
    background-color: none !important;
    }
    Zitat

    Außerdem hätte ich gerne unter jeder "Zeile" der toolbars ein anderes Bild. Geht das irgendwie ? Ich habs schon geschafft, menubar, toolbar und eben .tabbrowser-tabs zu trennen. Ich will jedoch auch noch die einzelnen Zeilen der Toolbar trennen. Zudem erscheint ja, wenn man während des Surfens auf F3 drückt, unten im Fenster noch eine Suchleiste. Die hat, wie ich das gesehen habe, den gleichen Hintergrund wie die toolbar. Das würde ich auch gerne noch extra steuern.

    2 Möglichkeiten:
    1. Mit dem Namen:

    Code
    toolbar[toolbarname="Navigations-Symbolleiste"]

    2. Mit Selektoren:

    Code
    toolbar {background-image: url(1.gif);}
    toolbar + toolbar {background-image: url(2.gif);}
    toolbar + toolbar + toolbar {background-image: url(3.gif);}


    die 2. Möglichkeit ist eigentlich schöner, aber bei den Toolbars im Hauptfenster versteckt sich nach der 2. Toolbar ein Toolbarset-Tag, sodass es etwas komplizierter wird:

    Code
    toolbar {background-image: url(1.gif);}
    toolbar + toolbar {background-image: url(2.gif);}
    toolbar + toolbar + toolbar, toolbar + toolbar + toolbarset + toolbar {background-image: url(3.gif);}
  • :shock: Wow, Danke für die schnelle Antwort!!!

    Ich habs mit

    Code
    toolbar[toolbarname="Navigations-Symbolleiste"]

    versucht und es hat auf Anhieb geklappt! :D:D

    Einzig die Statusbar will immer noch keinen Hintergrund annehmen, trotz

    CSS
    toolbar, .tabbrowser-tabs, statusbar {
       background-image: url("background4.gif") !important;
       background-color: none !important;
     }

    Keine Ahnung wieso???

  • Vielleicht so: