CSS anpassen: Internes Werkzeug statt DOM Inspector

  • Einige von euch sind ja recht aktiv mit Basteleien und benötigen dafür natürlich ein Werkzeug wie den DOM Inspector, um herauszufinden, welche Klassen sie ansprechen müssen usw. Firefox hat ab Version 29 ein solches Tool standardmäßig integriert, ich hatte darüber Anfang Dezember bereits geschrieben:

    Firefox: Neues Feature macht Browser-Anpassungen deutlich einfacher

    Ich wollte auf dieses Werkzeug noch einmal aufmerksam machen, weil es seit dem gestrigen Nightly endlich vernünftig benutzbar ist. Bislang musste man sich durch den DOM-Baum in der Markup-Ansicht kämpfen, nun kann man wirklich wie auf Webseiten das Inspector-Icon (ganz rechts in der Toolbox) wählen und dann einfach die Maus über die Oberfläche von Firefox führen und so Elemente auswählen.

    Falls es wer testen möchte: Zunächst müssen Chrome- und Remote-Debugging aktiviert werden. Dazu die Entwicklerwerkzeuge aufrufen (F12), links das Zahnrad-Icon wählen und die beiden entsprechenden Checkboxen setzen. Anschließend steht die sogenannte Browser Toolbox im Menü unter Web Developer zur Verfügung.

    Ziemlich cool, deutlich einfacher zu bedienen als der DOM Inspector. Vielleicht findet ihr das ja auch nützlich, dann könntet ihr ein Add-on in Rente schicken.

  • Und weil Bilder mehr sagen als tausend Worte:

    Externer Inhalt www.youtube.com
    Inhalte von externen Seiten werden ohne deine Zustimmung nicht automatisch geladen und angezeigt.
    Durch die Aktivierung der externen Inhalte erklärst du dich damit einverstanden, dass personenbezogene Daten an Drittplattformen übermittelt werden. Mehr Informationen dazu haben wir in unserer Datenschutzerklärung zur Verfügung gestellt.

  • Komme da ganz gut mit zurecht. Zum Nachgucken, wie was heisst, völlig ausreichend.
    Leider gibt es ausgerechnet dafür keinen Shortcut. Und man sollte im Hinterkopf behalten, dass dafür ein zusätzliches Profil mit dem Profilnamen AKTUELLER_NAME-chrome-debugger erstellt wird.

    Danke für den Tipp. :klasse: