Versionen im Vergleich

Version Alte Version 16 Neue Version 17
Änderungen wurden vorgenommen von

Maik Gnyza

Maik Gnyza

Gespeichert am

Schlüssel

  • Diese Zeile wurde hinzugefügt.
  • Diese Zeile wurde entfernt.
  • Formatierung wurde geändert.

Mit den integrierten Developer-Tools im Browser (bspw. Chrome) hat der Anwender die Möglichkeit, dass Frontend, die Html-Datei und die CSS-Datei gleichzeitig zu betrachten und Live zu bearbeiten. Die Änderung ist nur temporär im eigenen Browser.

...

In den CSS-Dateien werden alle Styling-Informationen einer Website gespeichert.


CSS

HTML

Frontend

Image Modified
Image Modified
Image Modified


Der Multishop verwendet verschiedene CSS-Dateien. Beispielsweise in der style.css, ist das Standard-Design definiert.

Die layout.css kann vom Shop-Admin im Backend bearbeitet werden (Einstellungen > Shop Layout > Farben anpassen). Hier definierte Stylings „überschreiben“ das Standard-Design.

Style.css

Layout.css

Image Modified
Image Modified


Der grundsätzliche Aufbau der Syntax ist immer gleich:

...

Diese Eigenschaft ist für die Veränderung der Hintergrundfarbe verantwortlich:


.feature_panel {
        background-color: #2fa595;
}
Wenn Sie die Eigenschaft kopiert haben, können Sie in die Shop-CSS gehen und die Eigenschaft unten an die CSS anhängen. Kopieren Sie idealerweise nur die Eigenschaft, die Sie bearbeiten wollen, um die Dateigröße der CSS so gering wie möglich zu halten. Achten Sie auch darauf, ob die Anweisung zur Klasse oder ID bereits vorhanden ist.

...