CSS
HTML
COMPONENTS
CODE HUB
CSS Font Size Generator
Konfiguration
Größenwert
Klasse
Vorschau
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Code
Coden lernen mit Lara
Meistere Programmierkonzepte Schritt für Schritt mit deinem interaktiven KI-Tutor. Lara erklärt komplexe Logik, überprüft deine Praxisübungen und hilft dir, ein solides Fundament in der Softwareentwicklung aufzubauen.
Interaktive Programmierlektionen, angepasst an dein eigenes Tempo.
Jetzt lernen mit Lara startenCSS Font Size Generator
In CSS können Sie die Schriftgröße von Textelementen mit der Eigenschaft font-size steuern. Die Eigenschaft font-size gibt die Größe der Schriftart an, die für Textinhalte innerhalb eines HTML-Elements verwendet wird. Sie können sie auf verschiedene Einheiten wie Pixel (px), Ems (em) oder Prozentsätze (%) usw. einstellen.
So können Sie die Eigenschaft font-size in CSS verwenden:
.text-element {
font-size: 16px;
}
.em-element {
font-size: 1.2em;
}
.percent-element {
font-size: 120%;
}
in diesem Beispiel:
- Die Klasse .text-element legt die Schriftgröße auf 16 Pixel fest.
- Die Klasse .em-element legt die Schriftgröße mit em-Einheiten auf das 1,2-fache der Schriftgröße des übergeordneten Elements fest.
- Die Klasse .percent-element legt die Schriftgröße mit Prozenteinheiten auf 120 % der Schriftgröße des übergeordneten Elements fest.
Sie können die Einheit auswählen, die Ihren Designanforderungen und Ihrem Layout am besten entspricht. Die Verwendung relativer Einheiten wie Ems oder Prozentsätze wird oft empfohlen, um responsive Designs zu erstellen, da sie mit den bevorzugten Schriftgrößeneinstellungen des Benutzers oder der Schriftgröße des übergeordneten Elements skaliert werden.
Denken Sie daran, dass das tatsächliche Erscheinungsbild von Text auch von der Schriftfamilie und anderen CSS-Eigenschaften wie font-family, font-weight und line-height abhängen kann. Durch Anpassen der Eigenschaft font-size können Sie die Größe des Textes steuern und gleichzeitig die allgemeine Designkonsistenz beibehalten.