Praktische technische Unterstützung
Bildschirmgröße, Zoom und CSS Pixel
Die Bildschirmgröße eines Browsers ist nützlich für die Unterstützung, aber es ist nicht immer die Display-Spezifikation, die auf der Verpackung aufgedruckt ist.
Zuletzt bewertet am:
Bildschirmgröße und Browser-Speicherplatz beantworten verschiedene Fragen
Ein Monitor kann eine hohe Hardwareauflösung aufweisen, während ein Browser einen kleineren logischen Bildschirm anzeigt, und eine Website muss auch in das tatsächliche Browserfenster passen, das viel schmaler als das Display sein kann. Bevor Sie ein abgeschnittenes Formular oder eine überlappende Schaltfläche diagnostizieren, identifizieren Sie den Wert, den Sie vergleichen.
Verstehen Sie die drei wichtigsten Messwerte
| Reading | Was es beschreibt | Verwenden Sie es für |
|---|---|---|
| Bildschirmgröße, in CSS-Pixeln | Die Bildschirmabmessungen, die von der Bildschirm-API des Browsers gemeldet werden. | Verständnis der Browseransicht des Displays, abhängig von Skalierung und Datenschutzverhalten. |
| Browserfenster, in CSS-Pixeln | Das Ansichtsfenster des Seitenlayouts und nicht die Außenseite des Browserrahmens. | Reproduzieren eines responsiven Layoutproblems oder Vergleichen von Fensterbreiten. |
| Geräte-Pixelverhältnis | Die Beziehung zwischen Gerätepixeln und CSS-Pixeln in der aktuellen Browserumgebung. | Erklärung der Dichte und einiger Zoom-Effekte.Es ist kein Monitormodell oder Hardware-Inventar. |
Warum Zoom und Anzeigeskalierung wichtig sind
CSS-Pixel sind Layout-Einheiten und nicht das Versprechen von jeweils einem physischen Bildschirmpixel. Die Skalierung des Betriebssystems und der Browser-Seitenzoom können die Beziehung dieser Einheiten zur Anzeige ändern. Ein Fenster mit den gleichen Außenabmessungen kann einer Seite bei höherem Seitenzoom weniger Layout-Fläche geben.
Der Pinch-Zoom auf einem Touch-Gerät unterscheidet sich vom gewöhnlichen Seitenzoom: Er kann das visuelle Ansichtsfenster vergrößern, ohne das Layout-Ansichtsfenster auf die gleiche Weise zu ändern. Diese Überprüfung meldet die Layoutwerte des Browsers, sodass nicht jede sichtbare Zoomänderung die Fensternummer ändert. Das Layout-Ansichtsfeld und Geräte-Pixelverhältnis.
Reproduzieren eines Layoutfehlers mit einer kontrollierten Änderung
- Open Der Bildschirm- und Fensterprüfer Im betroffenen Browser.
- Zeichnen Sie die beschriftete Fensterlesung, die Browserversion und jeden bekannten Seitenzoom auf.
- Vergleichen Sie ggf. auch den normalen Seitenzoom des Browsers, ohne die benötigten Einstellungen für die Barrierefreiheit zu entfernen.
- Kehren Sie zur betroffenen Seite zurück und wiederholen Sie die gleiche Aktion.
Wenn sich beispielsweise eine Checkout-Schaltfläche in einem schmalen Fenster überlappt, aber nicht in einem breiteren Fenster, senden Sie die Messwerte beider Fenster. Dies gibt einem Entwickler einen nützlichen Ausgangspunkt für die Reproduktion des Layouts, beweist jedoch nicht, dass der Monitor fehlerhaft ist oder dass Sie ein Display mit einer höheren Auflösung kaufen sollten.
Erfassen Sie den nützlichen Teil der Seite
Ein zugeschnittener Screenshot kann die Überschneidung oder das fehlende Steuerelement zeigen. Fügen Sie genügend umgebende Inhalte hinzu, um zu erklären, wo das Problem auftritt, und entfernen Sie dabei Namen, Kontodetails und private Registerkarten. Ihre überprüften Support-Details.
Wenn Sie die native Bildschirmauflösung benötigen
Die Multiplikation eines Browserbildschirms mit seinem Pixelverhältnis ist keine zuverlässige Methode, um die native Auflösung des Panels nachzuweisen, insbesondere wenn es um Zoom, Remote-Sitzungen, mehrere Displays oder Datenschutzeinstellungen geht.