HTML & CSS analysieren mit Chrome und Firefox

Oft wird uns die Frage gestellt, wie man beim Musterprojekt die Farbe, Größe oder andere Eigenschaften von bestimmten Seitenelementen verändern kann.

Um herauszufinden, welche CSS-Definitionen für ein bestimmtes HTML-Element vorhanden sind, kann man zum Beispiel die im Chrome-Browser integrierten Chrome Entwickler Tools nutzen. Firefox-Anwender können sich die kostenlose Erweiterung Firebug installieren, welche sehr ähnliche Funktionen bietet. Damit lassen sich auch Änderungen am CSS "live" testen, bevor man sie in die CSS-Dateien schreibt.

Dieses Video zeigt ein paar der vielen Möglichkeiten dieser beiden Werkzeuge.

Im Video wird unser altes Musterprojekt (Version 3) verwendet, aber die Techniken lassen sich auf jede Website anwenden.