So legen Sie Web-Schriftarten in CSS fest

CSS (Cascading Style Sheets) ist eine Sprache zur Beschreibung des Stils von Webseiten. Unter diesen sind Schriftarteinstellungen ein wichtiger Bestandteil von CSS, da sie die Größe, Farbe, Schriftart und Zeilenhöhe von Text auf Webseiten steuern können.

Die Schriftarteinstellung kann durch die Verwendung des „font“-Attributs in der CSS-Datei erreicht werden. Schauen wir uns jede dieser Eigenschaften einzeln an.

1. font-size
   font-size-Attribut wird verwendet, um die Textgröße festzulegen. Es kann in absoluten oder relativen Einheiten eingestellt werden. Zu den relativen Einheiten gehören em, rem, %, usw., während zu den absoluten Einheiten px, pt, cm usw. gehören. Unter diesen ist die Pixeleinheit (px) die am häufigsten verwendete Einheit, da sie sicherstellt, dass die Textgröße auf allen Geräten konsistent bleibt. Zum Beispiel:

h1{
  font-size: 36px;
}

Der obige Code gibt die Textgröße des h1-Elements auf 36 Pixel an.

2. font-family
   Die Eigenschaft „font-family“ wird verwendet, um den im Text angezeigten Schriftarttyp anzugeben. Mehrere Schriftarten werden als Alternativen geschrieben, sodass die alternative Schriftart zur Anzeige verwendet werden kann, wenn die Standardschriftart des Betriebssystems des Benutzers die ausgewählte Schriftart nicht unterstützt. Beispiel:

body{
  font-family: Arial, Helvetica, sans-serif;
}

Der obige Code gibt die Schriftart des Texts im Körperelement als Arial an. Wenn diese Schriftart nicht verfügbar ist, wird versucht, die Schriftart Helvetica zu verwenden. Wenn Helvetica ebenfalls nicht verfügbar ist, wird die standardmäßige serifenlose Schriftart des Systems verwendet.

3. font-weight
   Das Attribut „font-weight“ stellt die Dicke des Textes als Zahl oder Schlüsselwort dar. Je höher die Zahl, desto dicker der Text. Zu den Schlüsselwörtern gehören „normal“, „fett“, „fetter“ und „heller“. Zum Beispiel:

p{
  font-weight: bold;
}

Der obige Code gibt an, dass der Text im p-Element fett angezeigt wird.

4. font-style
   Das Attribut „font-style“ beschreibt den Schriftstil des Textes, der normal (normal), kursiv (kursiv) und schräg (kursiv) sein kann. Zum Beispiel:

em{
  font-style: italic;
}

Der obige Code gibt an, dass der Text im em-Element kursiv angezeigt wird. Die Eigenschaft „line-height“ definiert den Abstand zwischen Textzeilen. Der Wert kann mit der Länge oder dem Prozentsatz eingestellt werden. Beispiel:

p{
  line-height: 1.5;
}

5. Der obige Code gibt an, dass die Textzeilenhöhe im p-Element das 1,5-fache der Textgröße beträgt. Wenn die Textgröße 16 Pixel beträgt, beträgt die Zeilenhöhe 24 Pixel.
   

text-align

Das text-align-Attribut wird verwendet, um die Ausrichtung von Text innerhalb eines Elements zu steuern. Es kann auf links (linksbündig), zentriert (zentriert), rechts (rechtsbündig) usw. eingestellt werden. Zum Beispiel:

h1{
  text-align: center;
}

6. Der obige Code gibt an, dass der Text innerhalb des h1-Elements zentriert ist.
   

Textdekoration

Das Textdekorationsattribut wird verwendet, um den Dekorationseffekt von Text anzugeben, z. B. Unterstreichen, Durchstreichen usw. Es kann auf „Keine“, „Unterstrichen“, „Überstrichen“, „Durchgestrichen“ usw. eingestellt werden. Zum Beispiel:

a{
  text-decoration: underline;
}

7. Der obige Code gibt den Unterstreichungseffekt für alle Linkelemente an.
   
Zusammenfassend lässt sich sagen, dass Schriftarteinstellungen in CSS über eine Vielzahl von Eigenschaften erreicht werden können, darunter Schriftgröße, Schriftfamilie, Schriftstärke, Schriftstil, Zeilenhöhe, Textausrichtung und Textdekoration usw. Wenn wir lernen, diese Attribute zu beherrschen, können wir mehr Auswahlmöglichkeiten und Flexibilität beim Webdesign erhalten.

Das obige ist der detaillierte Inhalt vonSo legen Sie Web-Schriftarten in CSS fest. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!