Gunnar Bittersmann: Kann ein Kommentar in einer css-Datei an beliebiger Stelle stehen?

Beitrag lesen

@@Biff

Du suchst wahrscheinlich einen CSS-Präprozessor wie Sass oder Less.

Vielen Dank für die Links. Zu meinem eigenen Erstaunen bin ich nicht fähig den Seiten zu entnehmen, worum es überhaupt geht bei Sass und Less, wozu man die verwenden kann.

CSS-Präprozessoren generieren aus Code, der einer entsprechenden Syntax entspricht (bspw. SCSS), CSS-Code.

Beispiel: links SCSS-Quelltext; rechts generierter CSS-Code.

Was ist der Anwendungsfall dafür? Warum hast du verschiene CSS-Dateien? Warum verwendest du nicht eine?

Ich will in einem Skript für einen "Shop" (eCommerce), Zen Cart (https://www.zen-cart.com/), Vorlagen (Templates) anpassen. Diese Templates haben mehrere css-Dateien, warum, weiß ich nicht, möglicherweise wegen der Übersichtlichkeit, Vorteile bei der Bearbeitung, bei Updates, oder so.

Das erklärt nicht, warum du für verschiedene Teile einer Website verschiedene Stylesheets verwendest.

colors.css:

:root
{
  --green: #007C59;
  --yellow: #FCB514;
  --red: #E23D28;
  --blue: #0C1C8C;
}

foo.css:

@import url(colors.css);

#foo
{
  background: var(--green);
}

Vielen Dank für das Beispiel. Könnte man so vielleicht auch alle von einem selbst zugefügten Anweisungen in eine einzelne eigene / neu geschaffene css-Datei schreiben, so daß diese Datei einzig diese Anweisungen enthielte und auch (bei Updates) nicht überschrieben werden würde?

Genau das wollte ich mit dem Beispiel aufzeigen. colors.css ist deine „einzelne eigene / neu geschaffene css-Datei“, die von den anderen verwendet wird. (Statt des @import könnte die colors.css auch im HTML eingebunden werden.)

Allerdings gibt es in CSS keine „Anweisungen“, sondern nur „Hinweisungen“, wie Orlando anno dazumals schon anmerkte.

Oder – wie mermshaus schon sagte – einen CSS-Präprozessor verwenden.

Beide würden dann bei jedem Zugriff eines Besuchers auf die Website die css-Dateien abarbeiten und die Seiten entsprechend darstellen?

Nein. Beide arbeiten, bevor ein Besucher auf die Website zugreift. (LESS ließe sich auch mit JavaScript beim Aufruf der Seite kompilieren, aber das lassen wir mal.)

Der Unterschied zwischen Präprozessor und Postprozessor ist, dass ein Präprozessor aus etwas anderem als CSS (bspw. SCSS) CSS-Code generiert und ein Postprozessor aus CSS anderes CSS macht.

LLAP 🖖

--
„Wenn du eine weise Antwort verlangst, musst du vernünftig fragen.“ —Johann Wolfgang von Goethe