CSS

Text

Typografie entscheidet über Lesbarkeit: Schriftgrösse, Schriftdicke, Zeilenhöhe und Ausrichtung sind die wichtigsten Stellschrauben.

Schrift

font-size legt die Schriftgröße fest, meist in rem für skalierbare Layouts.

font-weight steuert die Dicke von normal bis bold beziehungsweise 100 bis 900.

font-family definiert die Schriftfamilie mit Fallback-Liste.

<font-size><font-weight><font-family>

Schrift-Grundlagen

body {
  font-family: Inter, system-ui, sans-serif;
  font-size: 1rem;
}

h1 {
  font-size: 2.5rem;
  font-weight: 700;
}

line-height bestimmt die Höhe einer Textzeile. Werte um 1.5 lesen sich in Fliesstext am besten.

text-align richtet Text links, rechts, zentriert oder im Blocksatz aus. letter-spacing verändert den Zeichenabstand.

<line-height><text-align><letter-spacing>

Fliesstext

p {
  line-height: 1.6;
  text-align: left;
  max-width: 65ch;
}

text-decoration steuert Unterstreichungen, etwa das Entfernen bei Links.

text-transform wandelt Text in Gross- oder Kleinschreibung um, ohne das HTML zu ändern.

<text-decoration><text-transform>

Markiere die Lektion als abgeschlossen, um XP und Streak zu erhalten.