Wie konvertieren Browser eine punktbasierte Schriftgröße in Pixel?

9

Wenn ein Browser mit dem folgenden CSS umgehen muss: %Code%, Wie berechnet es die effektive Größe auf dem Bildschirm? Kann es die dpi des Bildschirms (über einige OS Funktion) oder ist es nur eine Annäherung?

Wenn es eine Annäherung ist - ist es immer die gleiche (12pt = 16px)?

Schreibt irgendein Browser-Programmierer-Team darüber? (Eine Referenz wäre großartig)

    
Teetrinker 27.04.2015, 08:52
quelle

2 Antworten

1
  

CSS bietet eine Reihe verschiedener Einheiten für die Länge. Etwas   haben ihre Geschichte in der Typografie, wie Punkt ( pt ) und pica ( pc ),   Andere sind aus dem täglichen Gebrauch bekannt, wie Zentimeter ( cm ) und Zoll   ( in ). Und es gibt auch eine "magische" Einheit, die speziell erfunden wurde   für CSS: das px . Bedeutet das, dass unterschiedliche Eigenschaften anders sind   Einheiten?

     

Nein, die Einheiten haben nichts mit den Eigenschaften zu tun, sondern mit allem   mit dem Ausgabemedium: Bildschirm oder Papier.

     

Es besteht keine Einschränkung, welche Einheiten wo verwendet werden können. Wenn ein   property akzeptiert einen Wert in px (margin: 5px) und akzeptiert auch einen Wert   in Zoll oder Zentimetern (Rand: 1,2 Zoll; Rand: 0,5 cm) und   umgekehrt.

     

Die Beziehung zwischen den absoluten Einheiten ist wie folgt: 1 in = 2,54 cm = 25,4 mm = 72 pt = 6 pc

     

Die sogenannten absoluten Einheiten ( cm, mm, in, pt und pc ) bedeuten dasselbe   CSS wie überall sonst, aber nur wenn dein Ausgabegerät einen high hat   genug Auflösung . Auf einem Laserdrucker sollte 1 cm genau 1 sein   Zentimeter. Aber auf Geräten mit niedriger Auflösung, wie Computerbildschirmen,   CSS erfordert das nicht. Tatsächlich ist das Ergebnis anders   von einem Gerät zum anderen und von einer CSS-Implementierung zu einer anderen.   Es ist besser, diese Einheiten für hochauflösende Geräte und in   insbesondere für gedruckte Ausgabe. Auf Computerbildschirmen und Handheld   Geräte, werden Sie wahrscheinlich nicht bekommen, was Sie erwarten.

Auch weil Einheiten in pt nur auf dem Bildschirm (von oben) approximiert werden können, wird sie nicht zur Verwendung auf Bildschirmmedien empfohlen.

Quelle: EM, PX, PT, CM, IN ...

    
Ashesh Kumar Singh 27.04.2015 09:06
quelle
1

Die klarsten Aussagen wurden in diesem Artikel gefunden: Ссылка (Danke @Amit.)

  

In der Vergangenheit hat CSS verlangt, dass Implementierungen absolute Einheiten auch auf Computerbildschirmen korrekt anzeigen. Da jedoch die Anzahl der falschen Implementierungen die richtigen übertraf und die Situation sich nicht zu verbessern schien, gab CSS diese Anforderung 2011 auf. Gegenwärtig müssen absolute Einheiten nur auf gedruckter Ausgabe und auf hochauflösenden Geräten korrekt funktionieren.

     

Tatsächlich erfordert CSS, dass 1px in jeder gedruckten Ausgabe genau 1/96 Zoll groß sein muss. CSS ist der Ansicht, dass Drucker im Gegensatz zu Bildschirmen keine unterschiedlichen Größen für px benötigen, um scharfe Linien zu drucken. In Printmedien hat ein px also nicht nur von einem Gerät zum anderen die gleiche visuelle Erscheinung, sondern ist in der Tat messbar gleich (ebenso wie cm, pt, mm, in und pc, wie oben erläutert).

Und von hier: w3.org/TR/css3-values/#absolute-lengths (Danke @Alexey)

  

Sie [die absoluten Längeneinheiten] sind hauptsächlich nützlich, wenn die Ausgabeumgebung bekannt ist.

     

Bei einem CSS-Gerät sind diese Dimensionen entweder verankert (i), indem die physikalischen Einheiten mit ihren physikalischen Messungen in Beziehung gesetzt werden, oder (ii) indem die Pixeleinheit mit dem Referenzpixel in Beziehung gesetzt wird. Bei Druckmedien und ähnlichen hochauflösenden Geräten sollte die Ankereinheit eine der Standardeinheiten (Zoll, Zentimeter usw.) sein. Für Geräte mit niedriger Auflösung und Geräte mit ungewöhnlichen Betrachtungsabständen wird stattdessen empfohlen, dass die Ankereinheit die Pixeleinheit ist. Für solche Geräte wird empfohlen, dass die Pixeleinheit sich auf die gesamte Anzahl von Gerätepixeln bezieht, die dem Referenzpixel am nächsten kommt.

    
Teetrinker 27.04.2015 18:10
quelle

Tags und Links