Eine Möglichkeit, Ihre Website für Besucher attraktiver und interessanter zu gestalten, besteht darin, die Schriftfarbe zu ändern. Sie können verschiedene Farben verwenden, um wichtige Teile des Textes hervorzuheben oder eine bestimmte Stimmung zu erzeugen. In dieser exemplarischen Vorgehensweise erfahren Sie, wie Sie die Schriftfarbe mit HTML und CSS ändern können.
In HTML können Sie die Schriftfarbe mit einem Attribut ändern color. Dieses Attribut wird dem Tag hinzugefügt font oder direkt zu einem separaten Tag für den Text. Zum Beispiel:
Es wird jedoch empfohlen, CSS zu verwenden, um die Schriftfarbe zu ändern. In CSS werden die Farben mit dem Eigenschaftswert angegeben color. Sie können Schlüsselwörter wie "red" oder "blue" verwenden oder eine Farbe als Hexadezimalcode angeben. Zum Beispiel:
In diesem Beispiel ist die Schriftfarbe für den Titel blau.
Schriftarten in HTML: So wählen Sie die richtige aus
Bei der Auswahl einer Schriftart müssen mehrere Faktoren berücksichtigt werden. Erstens muss die Schriftart gut lesbar sein. Die optimale Größe, das Seitenverhältnis von Buchstaben und der Abstand zwischen Buchstaben spielen eine wichtige Rolle für die Lesbarkeit von Text. Zweitens muss die Schriftart zum Stil und zum Thema Ihrer Website passen. Wenn Ihre Website beispielsweise unternehmensorientiert ist, ist es am besten, eine ernsthafte und klassische Schriftart zu wählen. Wenn die Website auf ein jugendliches Publikum ausgerichtet ist, können Sie versuchen, mehr nicht standardmäßige und moderne Schriftarten zu verwenden.
Wenn Sie eine geeignete Schriftart ausgewählt haben, können Sie sie Ihrem HTML-Code mit CSS hinzufügen. Dazu können Sie die Eigenschaft "font-family" verwenden. Mit dieser Eigenschaft können Sie eine oder mehrere Schriftarten in der Prioritätsreihenfolge angeben. Wenn die erste angegebene Schriftart nicht verfügbar ist, versucht der Browser automatisch, die nächste Schriftart herunterzuladen.
Um beispielsweise Arial als Schriftart anzugeben, können Sie den folgenden CSS-Code verwenden:
body
font-family: Arial, sans-serif;>
Wenn Arial in diesem Beispiel nicht auf dem Computer des Benutzers verfügbar ist, versucht der Browser, eine andere Schriftart aus der serifenlosen Familie (sans-serif) zu verwenden.
Sie können auch bestimmte Schriftarten mit ihren Namen angeben:
body
font-family: "Arial", "Helvetica Neue", sans-serif;>
In diesem Beispiel sucht der Browser zuerst nach Arial, dann nach Helvetica Neue, und wenn beide Schriftarten nicht verfügbar sind, verwendet er eine beliebige serifenlose Schriftart.
Die Auswahl der richtigen Schriftart in HTML kann Ihre Website attraktiver und professioneller machen. Denken Sie daran, dass die richtige Kombination von Schriftarten und deren Verwendung die Wahrnehmung von Informationen durch den Benutzer beeinflussen können.
Wichtig: Wenn Sie benutzerdefinierte Schriftarten verwenden, stellen Sie sicher, dass sie auf verschiedenen Geräten und Browsern angezeigt werden, um sicherzustellen, dass sie korrekt angezeigt werden.
Die wichtigsten Arten von Schriftarten
Webentwickler haben viele Möglichkeiten, Schriftarten auszuwählen, um ihren Webseiten ein einzigartiges Aussehen und Design zu verleihen. Hier sind einige grundlegende Arten von Schriftarten, die weit verbreitet sind:
Serielle Schriftarten: Diese Schriften zeichnen sich durch kleine Vorsprünge oder Striche an den Enden der Buchstaben aus. Sie werden normalerweise zum Drucken von Text in Dokumenten wie Büchern, Zeitschriften und Zeitungen verwendet. Beispiele für solche Schriftarten sind Times New Roman, Georgia und Courier.
Textfreie Schriftarten: Diese Schriftarten haben keine Vorsprünge an den Enden der Buchstaben. Sie werden normalerweise verwendet, um Text auf Webseiten sowie in Werbematerialien und Logos anzuzeigen. Beispiele für solche Schriftarten sind Arial, Verdana und Helvetica.
Schriftarten mit fester Breite: Diese Schriftarten haben eine konstante Breite für jedes Zeichen, was sie ideal für die Anzeige von Code und anderen Textdaten macht, bei denen der genaue Abstand zwischen Zeichen und Zeichen wichtig ist. Beispiele für solche Schriftarten sind Courier New, Consolas und Lucida Console.
Schreibschrift: Diese Schriftarten imitieren das handschriftliche Schreiben und können Seiten ein persönlicheres und informelleres Aussehen verleihen. Sie werden häufig in Überschriften und Logos verwendet. Beispiele für solche Schriftarten sind Brush Script, Comic Sans und Monotype Corsiva.
Die Auswahl einer Schriftart ist ein wichtiges Element des Webdesigns, da sie die Lesbarkeit, Stimmung und den Eindruck eines Benutzers von einer Webseite beeinflussen kann. Es sollte daran erinnert werden, dass bei der Verwendung von Schriftarten auf Seiten die Verfügbarkeit berücksichtigt werden muss, damit sie für alle Benutzer gut lesbar sind.
Wie kann ich eine Schriftart in HTML angeben
In HTML können Sie eine Schriftart mit einem Attribut angeben style oder CSS-Stile. Es gibt mehrere Möglichkeiten, die Schriftart festzulegen:
-
Verwenden Sie grundlegende Schriftarten wie Arial, sans-serif, Times New Roman:
"font-family: Arial, sans-serif;">Пример текста
"font-family: Verdana, Courier New;">Пример текста
"font-family: 'Open Sans', 'Helvetica Neue', Arial, sans-serif;">Пример текста
Beachten Sie die Verwendung von Anführungszeichen im Attributwert font-family. Wenn der Schriftname aus mehreren Wörtern besteht, muss er in einfache oder doppelte Anführungszeichen eingeschlossen werden.
Verwenden eines Attributs style Sie können auch andere Schrifteinstellungen wie Größe und Fett festlegen. Zum Beispiel:
"font-family: Arial, sans-serif; font-size: 16px; font-weight: bold;">Пример текста
In diesem Beispiel werden die Einstellungen für die Schriftart festgelegt: Arial oder sans-serif, 16 Pixel groß und fett.
Ändern der Schriftfarbe in HTML
Sie können das color-Attribut verwenden, um die Schriftfarbe in HTML zu ändern. Es ermöglicht Ihnen, die Farbe für den Text innerhalb bestimmter Elemente festzulegen.
Um die Farbe des Textes zu ändern, müssen Sie ihn in das Tag einfügen, in dem das color-Attribut festgelegt wird. Zum Beispiel:
In diesem Beispiel ist der Text innerhalb des Tags
wird rot angezeigt.
Anstelle des Farbnamens können Sie auch die hexadezimale Darstellung der Farbe als Code verwenden. Um beispielsweise die Textfarbe als #00ff00 (grün) festzulegen, können Sie schreiben:
Sie können auch CSS anwenden, um die Schriftfarbe festzulegen. Verwenden Sie dazu die color-Eigenschaft in der CSS-Regel. Zum Beispiel:
Dieser CSS-Code gibt die Farbe für alle Elemente blau an
auf der Seite.
Auf diese Weise können Sie die Schriftfarbe in HTML mit dem color-Attribut oder über CSS-Regeln ändern.
Verwenden des Attributs "color"
Das Attribut "color" wird in HTML verwendet, um die Schriftfarbe einer Webseite zu ändern. Sie können dieses Attribut auf jedes Element anwenden, das Text enthält, z. B. Überschriften, Absätze oder Listen.
Beispieltext
Im obigen Beispiel haben wir die rote Schriftfarbe für das Element "p" mit dem Attribut "color" festgelegt. Sie können auch Farbnamen wie "red", "blue", "green" oder hexadezimale Farbwerte wie "#FF0000" (rot) oder "#0000FF" (blau) verwenden.
Obwohl das Attribut "color" immer noch gültig ist, wird empfohlen, CSS zu verwenden, um die Stile einer Webseite zu verwalten. Mit CSS können Sie die Schriftfarbe ändern, indem Sie den Wert für die Eigenschaft "color" festlegen.
Beispielcode mit CSS:
Im obigen Beispiel haben wir die rote Schriftfarbe für das Element "p" mit CSS festgelegt. Dies geschieht mit der Eigenschaft "color", der der Wert "red" zugewiesen wird.
Die Verwendung von CSS anstelle des "color" -Attributs ermöglicht eine bessere Kontrolle über Stile und eine einfachere Änderung bei Bedarf. Darüber hinaus hilft die Verwendung von CSS, die Struktur und den Inhalt einer Webseite von der visuellen Gestaltung zu trennen.
Wenn Sie jedoch die Farbe des Textes auf Ihrer Webseite schnell und vorübergehend ändern möchten, ist die Verwendung des Attributs "color" immer noch eine praktische Option.
Anwenden von Inline-Stilen zum Ändern der Schriftfarbe
Um die Schriftfarbe zu ändern, müssen Sie das Attribut `style` verwenden und es auf `color` setzen. Mit diesem Attribut können Sie einen Stil für ein bestimmtes Element festlegen. Um den Text beispielsweise rot zu machen, müssen Sie das Attribut `style` mit dem Wert `color:red` hinzufügen:
Этот текст будет красным
Sie können auch Farbnamen anstelle von hexadezimalen Werten verwenden. Um den Text beispielsweise blau zu machen, können Sie das Attribut `style` mit dem Wert `color:blue` hinzufügen:
Этот текст будет синим
Sie können die Schriftfarbe direkt zur Liste hinzufügen, indem Sie den Inline-Stil innerhalb des Tags ` verwenden
Mit Inline-Stilen können Sie die Schriftfarbe in HTML schnell und einfach ändern, ohne eine separate Stildatei erstellen zu müssen.
