Skip to main content

Das Font-Tag im Vergleich zu Cascading Style Sheets (CSS)

CSS im Vergleich zum HTML Font Tag - Episode 146 (Juni 2025)

CSS im Vergleich zum HTML Font Tag - Episode 146 (Juni 2025)
Anonim

Haben Sie sich eine sehr alte Website angesehen und im HTML ein ungewöhnliches Tag gesehen? Vor vielen Jahren setzten Webdesigner die Schriftarten ihrer Webseiten tatsächlich in den HTML-Code selbst ein, aber durch die Trennung von Struktur (HTML) und Stil (CSS) wurde diese Praxis vor einiger Zeit aufgehoben.

Im heutigen Webdesign wurde das Tag nicht mehr empfohlen. Dies bedeutet, dass das Tag nicht mehr Teil der HTML-Spezifikation ist. Einige Browser unterstützten dieses Tag nach dem Verfallsdatum weiterhin, werden jedoch in HTML5, der neuesten Version der Sprache, nicht mehr unterstützt. Dies bedeutet, dass das Tag nicht mehr in Ihren HTML-Dokumenten gefunden werden sollte.

Die Alternative zum Font-Tag

Wenn Sie die Schriftart des Textes innerhalb der HTML-Seite nicht mit dem Tag festlegen können, was sollten Sie verwenden? Mit Cascading Style Sheets (CSS) können Sie heute Schriftarten (und alle visuellen Stile) für Websites festlegen. CSS kann dieselben Funktionen wie das Tag und noch viel mehr. Sehen wir uns an, was das Tag tun könnte, wenn es eine Option für unsere HTML-Seiten war (denken Sie daran, es wird überhaupt nicht mehr unterstützt, ist also keine Option), und vergleichen Sie die Vorgehensweise mit CSS.

Ändern der Schriftfamilie

Das Schriftbild ist das Gesicht oder die Familie der Schrift. Mit dem font-Tag würden Sie das Attribut "face" verwenden, und Sie müssten dieses Dokument viele Male in ein Dokument einfügen, um die einzelnen Schriftarten für jeden Textabschnitt festzulegen. Wenn Sie eine umfassende Änderung dieser Schriftart vornehmen mussten, mussten Sie jedes einzelne dieser Tags ändern. Zum Beispiel:

Diese Schrift ist keine serifenlose Schrift

In CSS anstelle von Schrift "Gesicht" wird sie als Schriftfamilie bezeichnet. Sie schreiben einen CSS-Stil, der die Schriftart festlegen würde. Wenn Sie beispielsweise den gesamten Text einer Seite auf Garamond setzen möchten, können Sie diesen visuellen Stil folgendermaßen hinzufügen:

body {font-family: Garamond, Times, serif; }

Dieser CSS-Stil würde die Schriftfamilie von Garamond auf alles auf der Webseite anwenden, da jedes Element im Dokument ein Nachkomme von ist

Ändern der Schriftfarbe

Wie beim Gesicht verwenden Sie das Attribut "Farbe" und Hex-Codes oder Farbnamen, um die Farbe Ihres Textes zu ändern. Vor Jahren würden Sie dies auch individuell für Textelemente festlegen, beispielsweise für ein Header-Tag.

Diese Schrift ist lila

Heute würden Sie nur eine Zeile CSS schreiben.

Das ist viel flexibler. Wenn Sie das ändern mussten

Auf jeder Seite Ihrer Website können Sie eine Änderung in Ihrer CSS-Datei vornehmen, und jede Seite, die diese Datei verwendet, wird aktualisiert.

Mit dem Alten raus

Die Verwendung von CSS zur Festlegung visueller Stile ist seit vielen Jahren ein Standard für Webdesigner. Wenn Sie sich also tatsächlich eine Seite ansehen, die das Tag noch verwendet, dann handelt es sich um eine sehr alte Seite, die neu entwickelt werden muss, um dem aktuellen Web zu entsprechen Best Practices und moderne Webstandards entwerfen.

Herausgegeben von Jeremy Girard