Webdesign Grundlagen

#015 CSS Schriftgröße mit font-size und em, rem, px, %

Das Video erklärt Dir, wie Du die Schriftgröße mit CSS für HTML-Dokumente bestimmst und welche Maßeinheiten es gibt und was der Unterschied zwischen px, em, rem und % ist, zeigt das Video.

Um die Schriftgröße zu bestimmen, nutzt Du font-size.

Absolute Schriftgrößen in Pixel mit px

body {
    /* font-size › Schriftgröße in Pixel */
    font-size: 18px;
}

Relative Schriftgrößen mit em, rem und %

h1 {
    /* font-size › Schriftgröße in em */
    font-size: 1.5em;
}
h2 {
    /* font-size › Schriftgröße in rem */
    font-size: 1.5rem;
}
h3 {
    /* font-size › Schriftgröße in Prozent */
    font-size: 150%;
}

Übung: Passe die Schriftgröße von Fließtext und Überschriften Deinem Geschmack an oder erstelle eine Modular Scale mit www.modularscale.com, deren Werte Du übernimmst.