EM-PX-Umrechner – px, em und rem
Rechnen Sie em oder rem in Pixel und Pixel in em und rem um. Stellen Sie die Schriftgröße von Wurzel und Elternelement ein.
Formeln und Quellen aktualisiert · Datenquellen · 1Algorithmus, Konstanten und Standardwerte ansehen (JSON)
Über diesen Rechner
Bei font-size bezieht sich em auf die geerbte Elterngröße, rem auf die Wurzel. Bei 16 px Wurzelgröße und Elternfaktor 0,8 ist die Elterngröße 12,8 px: 1,5 em ergeben 19,2 px, aber 1,5 rem ergeben 24 px. Wählen Sie em oder rem für relative Eingaben und px für die Gegenrichtung.
Rechenbeispiel
berechnet mit den unten stehenden Standardwerten
Eingabeeinheit px · Grundschriftgröße 16 px · Umzurechnende Pixelgröße 24 px · Umzurechnende Größe 1,5 · Elterngröße relativ zur Wurzel 1 × · Verhältnis der Typo-Skala Große Terz (1.25) · Skalierungsschritte 5 Größe in em 1,5000 em · Größe in rem 1,5000 rem · Entsprechung in Wurzel-em 1,5000 em · Ergebnis in Pixel 24,00 px · Typo-Skala ab der Grundgröße +4: 39.06 px / 2.441 rem | +3: 31.25 px / 1.953 rem | +2: 25.00 px / 1.563 rem | +1: 20.00 px / 1.250 rem | Basis 0: 16.00 px / 1.000 rem · Hinweis Bei einer Elterngröße von 1 em sind em und rem identisch
Datenquellen
Haftungsausschluss
Diese Rechner liefern allgemeine Schätzungen. Größen, Preise, Verfügbarkeit und Normen unterscheiden sich nach Marke, Händler und Land; behandeln Sie das Ergebnis als Ausgangspunkt und gleichen Sie es mit den Angaben des Verkäufers ab.
Implementierungsquelle
Dieser Datensatz beschreibt die Implementierung dieser Seite, keine unabhängige Validierung. Externe Quellen stützen nur die angegebene Formel oder Definition; Schätzungen und eigene Regeln behalten ihre Annahmen.
Formel und Variablen
em = px ÷ (b × ep); rem = px ÷ b; px = em × b × ep = rem × b; px_i = b × r^i (i = 0 … steps − 1)
- px
- Pixelgröße
- b
- Wurzelschriftgröße in Pixel
- ep
- Elterngröße als Faktor der Wurzel
- em
- Größe relativ zum Elternteil
- rem
- Größe relativ zur Wurzel
- r
- Skalenverhältnis
- px_i
- Skalenstufe in Pixel
- steps
- Anzahl der Skalenschritte
Bei font-size bezieht sich em auf die geerbte Elterngröße, rem auf die Wurzel. Bei 16 px Wurzelgröße und Elternfaktor 0,8 ist die Elterngröße 12,8 px: 1,5 em ergeben 19,2 px, aber 1,5 rem ergeben 24 px. Wählen Sie em oder rem für relative Eingaben und px für die Gegenrichtung.
Häufige Fragen
Warum unterscheidet sich ein verschachteltes em von einem rem in diesem Umrechner?
Ein rem ist immer an die Grundschriftgröße von 16 px gebunden, sodass 1,5 rem 24 px sind, egal wo es steht. Ein em läuft mit dem Elternelement mit: der Umrechner multipliziert die Pixelgröße mit dem Elternfaktor, sodass ein 24-px-Wert in einem 0,8-em-Eltern zu 19,2 px zusammengesetztem em wird. Darum kann die verschachtelte Ausgabe niedriger lesen als das einfache em, selbst bei gleichen Eingaben.
Wie beeinflussen Eltern- und Wurzelschriftgröße die em-Umrechnung?
Bei font-size bezieht sich em auf die geerbte Elterngröße, rem auf die Wurzel. Bei 16 px Wurzelgröße und Elternfaktor 0,8 ist die Elterngröße 12,8 px: 1,5 em ergeben 19,2 px, aber 1,5 rem ergeben 24 px. Wählen Sie em oder rem für relative Eingaben und px für die Gegenrichtung.