course icon

Einführung in CSS

Hochgeladen : vor 4 Monaten Aktualisiert : vor 4 Monaten beginner

Was ist CSS?

CSS (Cascading Style Sheets) ist die Sprache, die Webseiten gestaltet. HTML liefert die Struktur; CSS entscheidet über das Aussehen — Farben, Schriften, Abstände und Layout.

Wie eine CSS-Regel aufgebaut ist

Eine Regel spricht Elemente mit einem Selektor an und listet dann Deklarationen (Eigenschaft: Wert) in geschweiften Klammern auf.

h1 {
  color: #1685bc;
  font-size: 2rem;
}

Drei Wege, CSS einzubinden

  • Inline — ein style-Attribut an einem Element (im echten Projekt vermeiden).
  • Intern — ein <style>-Block im <head>.
  • Extern — eine separate .css-Datei, eingebunden mit <link> (empfohlen).
<link rel="stylesheet" href="styles.css">

Bevorzugen Sie ein externes Stylesheet

Eine .css-Datei für mehrere Seiten hält das Design einheitlich und an einer Stelle änderbar.

Die Kaskade & Spezifität

Sprechen mehrere Regeln dasselbe Element an, entscheidet CSS nach Spezifität und dann Reihenfolge: Eine id schlägt eine Klasse, eine Klasse schlägt ein Tag; bei gleicher Spezifität gewinnt die spätere Regel.

Verwenden Sie !important sparsam

Es übergeht die normale Kaskade und erschwert die Fehlersuche. Greifen Sie zuerst zu einem besseren Selektor.

Häufige Fragen

Was bedeutet „kaskadierend“?
Stile summieren sich: mehrere Quellen (Browser, extern, intern, inline) wirken zusammen, und Regeln können einander nach Spezifität und Reihenfolge überschreiben.
Ist CSS eine Programmiersprache?
Nein — wie HTML ist es deklarativ. Modernes CSS hat Variablen und Funktionen, aber keine allgemeine Logik.
Wohin mit meiner CSS-Datei?
Irgendwo, wo die Seite sie erreicht; binden Sie sie im <head> mit <link rel="stylesheet"> ein.

Bereit für mehr?

Lernen Sie als Nächstes die wichtigsten CSS-Eigenschaften, um jede Seite zu gestalten.

Weiter zu den CSS-Grundlagen

Kommentare