Die Verwaltung der Schriftgröße spielt eine wichtige Rolle in der Struktur und dem Aussehen einer Webseite. Eine richtig angepasste Schriftgröße bietet Lesbarkeit und visuellen Komfort für Benutzer. In diesem Handbuch werden wir verschiedene Möglichkeiten zum Ändern der Schriftgröße in HTML untersuchen, von einfach bis komplexeren.
Das wichtigste Werkzeug zum Ändern der Schriftgröße in HTML ist das Tag . Um die Schriftgröße festzulegen, müssen Sie ein Attribut hinzufügen size und geben Sie einen Wert als Zahl zwischen 1 und 7 an. Je größer die Zahl ist, desto größer ist die Schriftgröße. Um beispielsweise die Schriftgröße auf 5 festzulegen, müssen Sie den folgenden Code verwenden:
Die Verwendung des Tags wird jedoch seit der HTML5-Version als veraltet angesehen. Die Verwendung von CSS-Stilen zur Anpassung der Schriftgröße ist ein moderner Ansatz.
Um die Schriftgröße mithilfe von CSS-Stilen festzulegen, müssen Sie die Eigenschaft verwenden font-size. Mit dieser Eigenschaft können Sie die Schriftgröße mit verschiedenen Größen wie Pixeln, Prozentsätzen oder em festlegen. Wenn Sie beispielsweise die Schriftgröße auf 16 Pixel festlegen möchten, verwenden Sie den folgenden Code:
Unter Verwendung verschiedener Eigenschaftswerte font-size. Sie können flexiblere und anpassungsfähigere Designs erstellen, die sich automatisch an die Bildschirmgröße oder die Vorlieben des Benutzers anpassen.
So ändern Sie die Schriftgröße in HTML: Eine detaillierte Anleitung
Das Ändern der Schriftgröße in HTML kann nützlich sein, wenn Sie einen bestimmten Text hervorheben oder ihn lesbarer machen möchten. In diesem ausführlichen Tutorial erfahren Sie, wie Sie die Schriftgröße in HTML ändern können.
Die einfachste Möglichkeit, die Schriftgröße zu ändern, besteht darin, ein Tag mit dem Attribut "style" zu verwenden. Hier ist ein Beispiel:
| HTML-Code: | Dies ist ein Text mit einer Schriftgröße von 20 Pixeln |
|---|---|
| Ergebnis: | Dies ist ein Text mit einer Schriftgröße von 20 Pixeln |
Sie können auch die Schriftgröße in Prozent festlegen. Zum Beispiel:
| HTML-Code: | Dies ist ein Text mit einer Schriftgröße von 150% |
|---|---|
| Ergebnis: | Dies ist ein Text mit einer Schriftgröße von 150% |
Neben der Verwendung eines Tags können Sie auch die Schriftgröße für den gesamten Absatz ändern, indem Sie ein Tag mit dem Attribut "style" verwenden. Zum Beispiel:
Dies ist ein Absatz mit einer Schriftgröße von 24 Pixeln
Es ist auch erwähnenswert, dass Sie relative Maßeinheiten wie "em" oder "rem" verwenden können, um die Schriftgröße relativ zur aktuellen Schriftgröße festzulegen. Zum Beispiel:
Dies ist ein Absatz mit einer Schriftgröße von 1.5em
Jetzt haben Sie alle Werkzeuge, die Sie benötigen, um die Schriftgröße in HTML einfach zu ändern. Verwenden Sie diesen Leitfaden, um schöne und lesbare Texte auf Ihrer Webseite zu erstellen.
Verwenden des Attributs "size"
Das Attribut "size" kann verwendet werden, um die Schriftgröße von Text in HTML anzugeben. Dieses Attribut wird auf das "font" -Tag angewendet und ermöglicht die Auswahl einer vordefinierten Schriftgröße.
Die folgende Tabelle zeigt die Werte an, die für das Attribut "size" verwendet werden können:
| Wert "size" | Schriftgröße |
|---|---|
| 1 | Kleiner als die Standardschriftart |
| 2 | Standardschriftart |
| 3 | Mehr Standardschriftart |
| 4 | Sehr große Schrift |
| 5 | Riesige Schrift |
Beispiel für die Verwendung des Attributs "size" zusammen mit dem Tag "font":
Dieser Text wird eine sehr große Schriftart sein.
Als Ergebnis wird der Text "Dieser Text wird eine sehr große Schriftart sein." wird mit einer sehr großen Schriftgröße angezeigt.
Anwenden der CSS-Eigenschaft "font-size"
CSS Mit der Eigenschaft "font-size" können Sie die Schriftgröße für Elemente einer Webseite festlegen.
Sie können diese Eigenschaft sowohl auf einzelne Elemente als auch auf Gruppen von Elementen anwenden, indem Sie den gewünschten Bemaßungswert festlegen.
Die Maßeinheit wird verwendet, um die Schriftgröße in CSS festzulegen. Die gebräuchlichsten Maßeinheiten für eine Schriftart sind Pixel (px), Prozentsätze (%) und em.
| Maßeinheit | Die Beschreibung |
|---|---|
| px | Gibt die Größe in Pixeln an. Beispiel: "font-size: 14px;" gibt die Schriftgröße auf 14 Pixel an. Ein Pixel ist eine feste Maßeinheit. |
| % | Gibt die Größe relativ zum übergeordneten Element an. Zum Beispiel erhöht "font-size: 120%;" die Schriftgröße um 20% der Größe des übergeordneten Elements. |
| em | Gibt die Größe relativ zur Schriftgröße des übergeordneten Elements an. Zum Beispiel erhöht "font-size: 1.5em;" die Schriftgröße um das 1,5-fache der Schriftgröße des übergeordneten Elements. |
Sie können die Eigenschaft "font-size" mit anderen CSS-Eigenschaften wie "font-weight", "font-style" und "font-family" kombinieren, um eindeutige Stile für den Text auf einer Webseite zu erstellen.
Ändern der Schriftgröße mit relativen Maßeinheiten
Es gibt verschiedene Arten von relativen Maßeinheiten, die Sie verwenden können:
- em ist die Einheit, die die Schriftgröße basierend auf der aktuellen Schriftgröße angibt.
- rem ist eine Einheit, die die Schriftgröße basierend auf der Grundschriftgröße des Dokuments festlegt.
- % ist eine Einheit, die die Schriftgröße als Prozentsatz der Grundschriftgröße des Dokuments angibt.
Um die Schriftgröße mit relativen Maßeinheiten zu ändern, müssen Sie einen Wert für die Schriftgröße in der entsprechenden Maßeinheit angeben. Zum Beispiel, um die Schriftgröße auf 1 zu setzen.5 mal so groß wie die Grundschriftgröße eines Dokuments, können Sie den folgenden Code verwenden:
Oder wenn Sie die Schriftgröße auf 80% der Grundschriftgröße des Dokuments festlegen möchten, können Sie den folgenden Code verwenden:
Durch die Verwendung relativer Maßeinheiten können Sie die Schriftgröße leicht ändern, abhängig von den Einstellungen des Benutzers oder der Art des angezeigten Inhalts. Dies ist praktisch, um ein ansprechendes und gut lesbares Design zu erstellen.
Verwenden des Pseudoelements "::first-letter"
Pseudo-Element "::mit "first-letter" können Sie den ersten Buchstaben der ersten Textzeile auswählen und stilisieren. Dies kann beim Erstellen von Stilen für Überschriften, die Anfangsbuchstaben eines Absatzes oder beim Erstellen von dekorativen Effekten hilfreich sein.
Beispiel für die Verwendung des Pseudoelements "::first-letter":
Заголовок статьи
Этот текст содержит первую букву, которая будет изменена.
In diesem Beispiel wird der erste Buchstabe des ersten Absatzes rot gefärbt, hat eine Schriftgröße von 24 Pixeln und eine Fettschrift.
Einige Merkmale der Verwendung des Pseudoelements "::first-letter":
-
Das Pseudo-Element "::first-letter" gilt nur für Block-Layout-Elemente, z. B. ,
usw.
Die Verwendung des Pseudoelements "::first-letter" bietet die Möglichkeit, einzigartige und ansprechende Stile für den ersten Buchstaben des Textes zu erstellen, was bei der Gestaltung einer Website oder eines Blogs hilfreich sein kann.
