Was ist CSS? Mit diesem Artikel startet mein kleiner CSS-Kurs für WordPress. Er ist gedacht für CSS-Einsteiger und/oder WordPress-Einsteiger. Dieser CSS-Kurs ist sehr einfach gehalten mit schnell zu erreichenden Ergebnissen.
Website, Homepage, WordPress, CSS, Custom CSS, Zusätzliches CSS – bei so vielen Begrifflichkeiten raucht einem WordPress- und CSS-Einsteiger schnell der Kopf.
„Und dabei wollte ich doch nur eine Website haben“. Ganz einfach, ohne viel Aufwand.
Die guten Nachrichten hierzu sind: Mit WordPress hast du bereits eine sehr gute Basis. Und kleine Änderungen am Layout kannst du recht flott und simpel über „Zusätzliches CSS“ vornehmen.
Falls du direkt zu einem anderen Kapitel gehen möchtest, so findest du hier eine Übersicht zu den Inhalten dieses CSS-Kurses.
Ok, los geht’s. In diesem Beitrag liefere ich dir ein bisschen Hintergrundwissen zu
- was ist CSS
- was bedeutet Cascading
- Zusammenspiel mit HTML.
Was ist CSS? Was bedeutet CSS, welche Aufgabe hat es?
Die drei Buchstaben, CSS, stehen für Cascading Style Sheet.
CSS beschreibt und definiert, wie HTML-Elemente dargestellt werden sollen. Dies zählt für den Bildschirm, Papier (Ausdruck), mobile Ansichten oder welches Medium auch immer genutzt werden soll für die Darstellung der Inhalte.
Das Besondere und Gute dabei ist: CSS erleichtert die Gestaltung einer Website enorm!
Es kontrolliert und steuert die Darstellung (Design und Layout) von zentraler Stelle aus, dem externen Stylesheet (external style sheet).
Änderungen an dieser zentralen Stelle wirken sich auf die ganze Website aus. So kannst du zum Beispiel die Schriftart deiner kompletten Website mit einer Änderung vornehmen, statt auf jeder einzelnen Seite die neue Schriftart zu definieren.
Was ist CSS – diese Frage ist hiermit hoffentlich beantwortet.
Eine kleine Ergänzung: Dieser CSS-Kurs befasst sich NICHT mit dem external style sheet, dessen Aufbau, Child Themes, usw. Es geht lediglich um einfache Anpassungen über „Zusätzliches CSS“ (bzw. Custom CSS) in WordPress.
Was bedeutet Cascading?
Wörtlich übersetzt bedeutet Cascading „hintereinandergeschaltet“. Das Cascading Style Sheet ist somit so etwas wie „das Blatt der hintereinandergeschalteten Stilbefehle“ (eine sehr freie Übersetzung von mir).
Eigentlich ist es jedoch recht einfach mit einer Übersetzung oder Beschreibung:
CSS ist eine Liste an Befehlen, wie HTML-Elemente dargestellt werden sollen.
Zusammenspiel mit HTML
Mit HTML beschreibst du die Inhalte, den Aufbau und vor allem die Struktur deiner Website. Zum Beispiel
<h1>Dies ist eine Überschrift der Ebene 1</h1>
<p>Und ich bin ein Absatz</p>
Hiermit hast du jetzt ein bisschen Struktur definiert, jedoch noch keine weiteren Attribute. Hübsch ist das nicht.
Mit HTML kannst du zwar auch das Layout und Design der Seite gestalten, jedoch müsstest du das für jede einzelne Seite machen. Das ist vielleicht ok beim Neuaufbau einer Seite. Stelle dir jedoch vor, du musst für eine fünf Jahre alte, sehr aktive Website Schriftart und Farbe ändern. Auf jeder Seite. Für jeden Artikel. Das ist definitiv kein Spaß.
CSS löst dieses Problem und erspart dir somit eine Menge Arbeit. Du kannst deine ganze Website neu gestalten, indem du Änderungen im „externen Stylesheet“ vornimmst.
Weiter zu Teil 2
Das war es bereits mit etwas Hintergrundwissen zu CSS. Im zweiten Teil geht es nun um die Struktur und den korrekten Aufbau von CSS.
Hier geht es weiter zu Teil 2:
Aufbau und Struktur von CSS in WordPress
CSS-Kurs (WordPress) Inhaltsverzeichnis:
Und hier geht es zur Übersichtsseite für den kleinen CSS Einsteigerkurs.
Viel Erfolg mit deiner Website, WordPress und CSS!