Schriftfamilie#

Die Schriftfamilie (Schriftart) kann mittels der Eigenschaft font-family verändert werden. Um eine Schriftfamilie zu verwenden, muss der Schriftname als Wert font-family übergeben werden.

Mehrere Schiftfamilien können über Komma getrennt angegeben werden. Wenn eine Schrift nicht gefunden werden kann, wird die nächste Schrift in der Aufzählung verwendet. Es sollte immer eine Backup-Familie angegeben werden. Dies geschieht für serifenlose Schriften über die sans-serif-Angabe und für serifen Schriften über serif.

Wichtig

Besteht der Name der Schrift aus mehreren Wörtern, muss die der Name in doppelten Anführungszeichen angegebene werden.

Die Standardschrift für sans-serif ist „Arial“ und für serif „Times New Roman“.

p {
  font-family: "Comic Sans MS", Calibri, serif;
}

See the Pen font-family-1 by csswebsite (@csswebsite) on CodePen.

Google Fonts#

Über die Website Google Fonts können freie Schriften in die Website heruntergeladen und als Schriftfamilie verwendet werden.

@import url("https://fonts.googleapis.com/css2?family=Syne+Tactile&display=swap");
p {
  font-family: "Syne Tactile", sans-serif;
}

See the Pen font-family-2 by csswebsite (@csswebsite) on CodePen.

Wichtig

Die @import-Anweisung sollte immer als erste Anweisung in der CSS-Datei geschrieben werden. Danach kommen erst die weiteren Anweisungen.