Umrechner für CSS-Einheiten
px, rem, em, pt und die übrigen CSS-Längeneinheiten umrechnen.
Fülle die Felder aus, dann erscheint das Ergebnis hier automatisch.
Vergleicht CSS-Längen über das CSS-Pixel mit ausdrücklich angegebenen rem- und em-Bezugsgrößen. Feste Verhältnisse sind 1in=96px, 1pt=96/72px und 1pc=16px. rem bezieht sich auf die berechnete Schriftgröße des Wurzelelements. em nutzt bei gewöhnlichen Eigenschaften die berechnete Schriftgröße des Elements selbst, bei font-size dagegen die geerbte Größe. Das Feld „em-Bezugsgröße“ legt diesen Kontext fest.
So funktioniert es
Formel und Logik
Jede Einheit erhält einen Faktor f in CSS-Pixeln. Ergebnis = Wert·fQuelle/fZiel. rem nutzt die Wurzelschriftgröße, em die angegebene Bezugsgröße; 1cm=96/2,54px und 1mm=96/25,4px. Beide Bezugsgrößen müssen positiv sein, da auch die Vergleichszeilen sie verwenden. Null und negative Längen sind rechnerisch erlaubt, können aber bei einer bestimmten CSS-Eigenschaft unzulässig sein.
Beispiel
Bei einer Wurzelgröße von 16 px sind 24 px gleich 1,5 rem und 18 pt.
Felder und Einheiten
- Wert — px
- Von Einheit — Auswahl aus der Liste
- Nach Einheit — Auswahl aus der Liste
- Wurzelschriftgröße — px
- em-Bezugsgröße — px
So wird gerechnet
- — Wähle Quell- und Zieleinheit und gib die Länge ein.
- — Trage die berechnete Wurzelschriftgröße und die zutreffende em-Bezugsgröße in CSS-Pixeln ein.
- — Die Zieleinheit steht in der Ergebnisbeschriftung; Vergleichszeilen verwenden dieselben Bezugsgrößen.
Rechenweg und Grenzen
- Rechenweg
- Formel und Logik
- Datenquelle oder Norm
- W3C CSS Values 3: em/rem und absolute Einheiten (Entwurf)
- Einschränkung
- CSS-Längenumrechnung mit dem angegebenen Kontext; sie misst keine Bildschirmdichte und prüft keine Eigenschaft auf zulässige Längen.
FAQ
Wie unterscheiden sich rem und em?
rem nutzt die berechnete Wurzelschriftgröße. Bei margin oder width bezieht sich em auf die eigene Schrift des Elements, bei font-size auf die geerbte Größe. Gib die für diese Eigenschaft geltende Bezugsgröße ein.
Entspricht ein CSS-Zentimeter einem echten Zentimeter?
Das Verhältnis von cm zu px ist fest: 1cm=96/2,54px. Die physische Größe hängt von der Verankerung absoluter Einheiten am Gerät ab; auf dem Bildschirm ist kein Linealmaß garantiert.
Verhindert px den Browserzoom?
Nein. Seitenzoom funktioniert auch mit px. rem kann einer benutzerdefinierten Wurzelschrift folgen; Barrierefreiheit muss am tatsächlichen Layout geprüft werden.
Ergeben 62,5% immer eine Wurzelschrift von 10px?
Nur bei einer Ausgangsgröße von 16px: 0,625·16=10. Mit einer Ausgangsschrift von 20px werden es 12,5px. Hier wird die tatsächlich berechnete Größe eingegeben.