CSS/Eigenschaften/font-size

Die Eigenschaft font-size bestimmt die zu verwendende Schriftgröße

Erlaubte Werte

• eine nicht negative Längenangabe
• eine Prozentangabe
• xx-small, x-small, small, medium, large, x-large, xx-large, xxx-large
  siehe Zuordnung Schriftgröße – Schlüsselwort
• smaller, larger
  siehe relative Schriftgrößen

Vererbung steuernde Werte inherit, initial, unset und revert

Standardwert

medium

anwendbar auf

alle Elemente

Vererbung

ja

animierbar

ja

Beispiel

strong {
  font-size: larger; 
}

legt für alle strong-Elemente eine im Vergleich zum Elternelement größere Schrift fest

Beachten Sie: Alle prozentualen Angaben beziehen sich auf die Schriftgröße des Elternelements.

Empfehlung: Verwenden Sie relative Einheiten.

Siehe auch

• Typografie/Schriftformatierung
  • Schriftgröße
• Vergessen Sie den Begriff Pixel!
• Schriftgröße abhängig vom Container ändern
  Schriftgröße passt sich responsiv an die Breite des umgebenden Container-Elements an!

Weblinks

• Spezifikation (W3C): CSS Fonts Module Level 4
• MDN: font-size

Zuordnung Schriftgröße – Schlüsselwort

Schlüsselwort	Skalierung	Schriftgröße hx
xx-small	3/5	h6
x-small	3/4
small	8/9	h5
medium	1	h4
large	6/5	h3
x-large	3/2	h2
xx-large	2	h1
xxx-large	3

Bei dieser Tabelle handelt es sich lediglich um eine Empfehlung für die Browserhersteller, wie die absoluten Größenangaben untereinander zu skalieren sind.

Beachten Sie: Die meisten™ Internetnutzer schrauben nicht an den Browsereinstellungen zur Schriftgröße herum. Wer es tut, legt aber eventuell auch eine Mindestschriftgröße fest, womit bestimmte Festlegungen eine für den Autor unerwartete Ausgabe generieren könnten.

Empfehlung: Verwenden Sie für die Schriftgröße relative Maße wie rem oder em.

relative Schriftgrößen

Die Angaben larger und smaller beziehen sich auf die Schriftgröße des Elternelements. Wenn das übergeordnete Element ein Schlüsselwort für die Schriftgröße in der Tabelle für die Zuordnung von Schlüsselwörtern zur absoluten Größe hat, kann larger die Schriftgröße bis zum nächsten Eintrag in der Tabelle und smaller die Schriftgröße bis zum vorherigen Eintrag in der Tabelle berechnen.

Die Browser können aber auch ein einfaches Verhältnis verwenden, um die Schriftgröße relativ zum übergeordneten Element zu erhöhen oder zu verringern. Das Verhältnis ist nicht spezifiziert, sollte aber etwa 1,2–1,5 betragen und kann bei verschiedenen Elementen variieren.