So ändern Sie Schriftart, -größe und -farbe auf einer Webseite

Schriftgröße

Diese Seite enthält Anweisungen zum Ändern einer Schriftart und ihrer Farbe auf einer Webseite. Mit der Einführung von HTML5 können Sie Webseitenschriftarten ordnungsgemäß konfigurieren, indem Sie Cascading Style Sheets verwenden. Die alte Methode, ein Inline-Stilattribut oder ein Schriftart-Tag zu verwenden, ist veraltet und sollte nicht mehr verwendet werden.


Verwenden von CSS für eine einzelne Anwendung

Wenn Sie die Schriftfläche und ihre Farbe auf einer Webseite nur einmal ändern möchten, konfigurieren Sie ihre Attribute im Element-Tag. Mithilfe des Stilattributs können Sie die Schriftfläche und -farbe mit Schriftfamilie, Farbe und die Schriftgröße mit Schriftgröße angeben, wie im folgenden Beispiel gezeigt.

Beispielcode

<p style = "Schriftfamilie: Kurier; Farbe: Blau; Schriftgröße: 20px; "> Dieser Text hat die Schriftart Courier, ist Blau und 20px. </ P>

Ergebnis

Dieser Text hat die Courier-Schriftart, ist blau und 20 Pixel groß.

Verwenden von CSS für eine oder mehrere Seiten

Benutzerdefinierte Schriftart für eine Seite

Im Kopfbereich Ihrer Webseite können Sie Code zwischen die Registerkarten <style> </ style> einfügen, um das Erscheinungsbild Ihres Textes in verschiedenen Elementen zu ändern. Das nächste blaue Feld enthält Beispielcode, der nach dem Aufrufen Ihre Schriftart in Courier ändert und rot färbt. Wie Sie sehen können, haben wir den Klassennamen als "benutzerdefiniert" definiert.

<style type = "text / css"> .custom {Schriftfamilie: Courier; Farbe Rot; Schriftgröße: 20px; } </ style>

Einmal definiert, kann dieses Styling auf die meisten Elemente auf Ihrer Seite angewendet werden, indem die Klasse "Benutzerdefiniert" an sie angehängt wird. Das folgende Feld zeigt zwei Codezeilen und ihre jeweiligen Ergebnisse.

Beispiel

<p class = "custom"> Dieser ganze Satz ist rot und Courier </ p> <p> Nur das Wort <span class = "custom"> test </ span> ist rot und Courier. </ p>

Ergebnis

Dieser ganze Satz ist rot und Kurier.

Nur das Wort Test ist rot und Kurier.

Benutzerdefinierte Schriftart für viele Seiten

Das Importieren einer externen CSS-Datei kann sehr vorteilhaft sein, da Benutzer Regeln für mehrere Seiten gleichzeitig ändern können. Der folgende Abschnitt zeigt ein Beispiel zum Erstellen einer einfachen CSS-Datei, bei der die Schriftart und die Farbe für die meisten Elemente geändert werden. Diese Datei kann in mehr als eine Webseite geladen werden, sogar in eine ganze Site.

Wenn Sie den folgenden Text mit einem einfachen Texteditor als CSS-Datei speichern, wird er für den Import vorbereitet.

@charset "utf-8" ;. courier {Schriftfamilie: Courier; Farbe: # 005CB9; }}

Sobald der vorhergehende Text in eine CSS-Datei eingefügt wurde (wir haben unsere basic.css genannt), können Sie von jeder anderen Seite aus mit einer Zeile ähnlich dem folgenden Beispiel darauf verlinken.

<link rel = "stylesheet" Type = "text / css" href = "http://www.example.com/basic.css">

Lösung für Schriftarten

Obwohl veraltet, kann das HTML-Tag <font> weiterhin verwendet werden und muss möglicherweise für einige Onlinedienste verwendet werden. Wenn Sie das FONT-Tag verwenden, müssen Sie das Gesichtsattribut angeben, das die zu verwendende Schriftart beschreibt. Im folgenden Beispiel verwenden wir die Courier-Schriftart und den hexadezimalen Farbcode # 005CB9, der dunkelblau ist.

Beispielcode

<font color = "# 005CB9" face = "courier" size = "5"> Ein spezielles Schriftbeispiel. </ font>

Ergebnis

Ein spezielles Schriftbeispiel.


Schreibe einen Kommentar