Mit dem Google-Developer-Tool hat der Anwender die Möglichkeit das Frontend, die Html und die CSS gleichzeitig zu betrachten.
...
Mit dem Google Developer Tool können sie Sie z.B anschauen wie sich die Website auf verschieden Geräten darstellt.
So kann das responsive Design der Website getestet werden.
PC
Mobilgeräte
Nur temporäre Änderungen
Wenn sie permanent sein sollen dann muss man sie manuell in die CSS einfügen
nur die Eigenschaften in die CSS die du ändern möchtestDes Weiteren haben Sie die Möglichkeit temporäre Anpassungen auf der Website live zu testen.
Sie können sowohl die Farbe, als auch die Position und Größe von Bildern, so wie viele Weitere Veränderungen vornehmen, ohne die CSS des Shops zu beeinflussen.
Alle Anpassungen sind bei einem erneuten Aufrufen oder beim Aktualisieren der Website in den Originalzustand zurückgesetzt.
Wenn Ihnen die Anpassungen gefallen und Sie die Änderungen permanent in Ihrem Shop haben wollen, haben Sie die Möglichkeit die Shop-CSS manuell anzupassen.
Dafür wählen sie nur die Eigenschaft aus die Sie für Ihre Anpassung brauchen und kopieren sie .
Diese Eigenschaft ist für die Veränderung der Hintergrundfarbe verantwortlich
- background-color: #2fa595;
- overflow: hidden;
- padding: 15px;
- margin: 10px 15px;
- display: block;
Was Sie beachten müssen:
Bevor Sie etwas in die CSS einfügen sollten Sie nachschauen,ob die Eigenschaft schon in der CSS vorhanden ist oder ob Sie diese neue einfügen.
Kontrollieren Sie, ob Ihre Anpassung tatsächlich nur die Bereiche verändert die Sie geändert haben wollen.
Achten Sie darauf, dass Ihre Anpassungen responsive sind und unabhängig von dem Medium auf dem sie angezeigt werden funktionieren.