Websiteentwicklung: CSS: Schriftart

Aus Wikibooks

Inhaltsverzeichnis 1 Erklärung 2 Schriftarten 2.1 Kategorien der Schriftartfamilien 3 Anwenden von Schriftarten 4 Besonderheit 5 Navigation

[Bearbeiten] Erklärung

Mit Hilfe von font-family lassen sich verschiedene Schriftarten verwenden.

[Bearbeiten] Schriftarten

In CSS werden sogenannte Schriftartfamilien verwendet. Diese Schriftartfamilien haben jeweils Schriftarten.

So hat die Schriftartfamilie Arial die Schriftarten: Arial Bold, Arial Italic oder Arial Bold Italic

Häufig verwendete Schriftartfamilien sind:

• Times
• Arial
• Helvetica
• Verdana
• Courier
• Comic

[Bearbeiten] Kategorien der Schriftartfamilien

Schriftartfamilien werden in fünf Kategorien eingeteilt.

• Serif haben Serifen und sind proportional. Bei proportionalen Schriftarten haben die Buchstaben unterschiedliche Breiten. So ist ein "m" breiter als ein "i". Serifen sind weitere Verzierungen der Schriftarten. Beispielschriftarten: Times, Garamond
• Sans Serif haben keine Serifen sind aber ebenfalls proportionale Schriftarten. Beispielschriftarten: Arial, Geneva, Helvetica, Tahoma, Verdana
• Monospace können Serifen aufweisen sind aber keine proportionale Schriftarten. D.h. jeder Buchstabe nimmt den gleichen Platz ein wie ein anderer. Auch als Schreibmaschinenschrift bekannt. Beispielschriftarten: Courier, Lucida Console
• Cursive sind Schriftarten die Handschriften ähneln. Beispielschriftarten: Comic Sans, Lucida Handwriting
• Fantasy sind Schriftarten die in keines der anderen vier Muster passen.

[Bearbeiten] Anwenden von Schriftarten

Mit CSS muss man einem Text keine bestimmte Schriftart zuweisen. Es ist möglich dem Browser bestimmte Regeln für die Verwendung einer Schriftart zu diktieren ohne eine Schriftart zu bestimmen. Dies ist dann vielversprechend, wenn man davon ausgeht, dass dem Browser nicht alle Schriftarten zur Verfügung stehen.

Beispiel:

font-family: Monospace;

Ein unkonfigurierter Browser würde Courier als Schriftart verwenden. Steht ihm Courier nicht zur Verfügung, nimmt er beispielsweise FreeMono. Dies verhindert eine unerwünschte Darstellung des Textes.

Die Verwendung einer bestimmten Schriftart würde so aussehen:

Beispiel:

font-family: "Times New Roman";

[Bearbeiten] Besonderheit

Nicht jeder Browser unterstützt alle Schriftarten, daher ist es möglich, mehrere Schriftarten zu definieren. Dazu wird zunächst die bevorzugte Schriftart, dann durch ein Komma getrennt die zweite Schriftart angegeben. Diese wird dann verwendet, wenn der Browser die erste nicht kennt.

font-family: Arial, Verdana;

Es lassen sich auch mehr als 2 Schriftarten definieren. Die erste Schriftart, die der Browser kennt, kommt zum Einsatz.

Es ist auch möglich, zunächst eine vorgegebene Schriftart zu nutzen. Ist dem Browser diese Schriftart nicht bekannt, so soll er eine Schriftart der gleichen Kategorie nutzen.

font-family: Arial, sans-serif;

[Bearbeiten] Navigation