HTML <basefont>-Tag
Das <basefont>-Tag legt die Standard-Schriftgröße und -farbe des Textes fest. Es kann mehrfach in <head>- oder <body>-Tags verwendet werden. Beispiele ansehen.
Das <basefont>-Tag legte die Standard-Schriftgröße, -farbe und -schriftart für den gesamten Text einer Seite fest. Es konnte innerhalb der <head>- oder <body>-Tags platziert werden, und jeder Text, der die Schriftart nicht überschrieb, erbte diese Werte.
Diese Seite erklärt, was <basefont> bewirkte, warum es aus HTML entfernt wurde und welches CSS man heute schreiben sollte, um dasselbe Ergebnis zu erzielen.
Das <basefont> ist ein veraltetes HTML-Tag. Es wurde in HTML5 entfernt und darf in neuen Seiten nicht mehr verwendet werden. Die folgenden Abschnitte zeigen den modernen CSS-Ersatz.
Warum <basefont> veraltet ist
<basefont> ist ein präsentationsorientiertes Tag: Es mischt Stilinformationen direkt in das HTML-Markup. Modernes HTML folgt dem Prinzip der Trennung der Zuständigkeiten — HTML beschreibt die Struktur und Bedeutung des Inhalts, während CSS die gesamte Präsentation (Schriften, Farben, Größen, Abstände) übernimmt. Da <basefont> ausschließlich zur Präsentation diente, hat HTML5 es vollständig zugunsten von CSS aufgegeben.
Zwei praktische Konsequenzen:
- Die Browser-Unterstützung ist unzuverlässig. Schon vor HTML5 war das Verhalten browserübergreifend unterschiedlich, und moderne Browser können
<basefont>vollständig ignorieren. Man kann nicht darauf zählen, dass es irgendetwas darstellt. - Es ist kein gültiges HTML5. Ein Dokument, das
<basefont>verwendet, besteht die Validierung nicht, und Werkzeuge (Linter, Editoren, Frameworks) werden es markieren.
<basefont> kann einem noch begegnen, wenn man ältere Websites, E-Mail-Vorlagen oder Content-Management-Systeme wartet, die vor HTML5 geschrieben wurden. In diesem Fall ist der sichere Weg, das Tag zu löschen und durch das entsprechende CSS zu ersetzen, das unten gezeigt wird.
Syntax
Das <basefont>-Tag ist leer, was bedeutet, dass das schließende Tag nicht erforderlich ist. In XHTML muss das (<basefont>)-Tag jedoch geschlossen werden (<basefont/>).
Beispiel des HTML-<basefont>-Tags:
<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
<basefont color="green" face="Helvetica" size="14">
</head>
<body>
<h3>Title of the text.</h3>
<p>Paragraph of the text.</p>
</body>
</html>Der moderne CSS-Ersatz
Um genau das nachzubilden, was <basefont> tat, setzt man die entsprechenden CSS-Eigenschaften am body-Selektor. Jedes alte Attribut wird dabei eins zu eins auf eine CSS-Eigenschaft abgebildet:
<basefont>-Attribut | CSS-Eigenschaft | Beispielwert |
|---|---|---|
color | color | green |
face | font-family | Helvetica |
size | font-size | 14px |
Alle drei lassen sich auch auf einmal mit der font-Kurzschreibweise angeben.
Warum body als Ziel? <basefont> funktionierte, indem es seitenweite Standardwerte setzte, die jedes Element erbte, sofern es keine eigene Schriftart angab. CSS reproduziert dies über die Kaskade: color, font-family und font-size sind vererbbare Eigenschaften. Wenn man sie auf body setzt, erben alle untergeordneten Elemente (Überschriften, Absätze, Listen usw.) automatisch dieselben Werte — es sei denn, eine spezifischere Regel überschreibt sie. Das Gestalten von body bietet daher dieselbe einzige Quelle der Wahrheit, die <basefont> einst bot, jedoch mit gültigem HTML5 und zuverlässigem browserübergreifendem Verhalten.
Beispiel des CSS-Ersatzes für <basefont>:
<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
<style>
body {
color: green;
font-family: Helvetica;
font-size: 14px;
}
</style>
</head>
<body>
<h3>Title of the text.</h3>
<p>Paragraph of the text.</p>
</body>
</html>Dies erzeugt denselben grünen, 14px großen Helvetica-Text wie das veraltete Beispiel <basefont color="green" face="Helvetica" size="14"> oben — ist jedoch gültiges HTML5 und wird browserübergreifend einheitlich dargestellt.
Attribute
| Attribut | Wert | Beschreibung |
|---|---|---|
| color | color | Legt die Standard-Textfarbe fest. Wird in HTML5 nicht unterstützt. |
| face | font_family | Definiert die Schriftart des Textes. Wird in HTML5 nicht unterstützt. |
| size | number | Gibt die Schriftgröße an. Wird in HTML5 nicht unterstützt. |