Wie wirken sich Ansichtsfensterabmessungen und DPR auf die Simulation in Chrome DevTools aus?CSS

CSS verstehen
Guest
 Wie wirken sich Ansichtsfensterabmessungen und DPR auf die Simulation in Chrome DevTools aus?

Post by Guest »

Ich versuche, mein Gerät in Chrome DevTools genau zu simulieren und benötige einige Erläuterungen.
Mein tatsächliches Gerät hat eine Auflösung von 1220 x 2712 Pixel mit einem DPR ( Gerätepixelverhältnis) von 3. Passend dazu habe ich in Chrome DevTools einen benutzerdefinierten Geräteeintrag mit einem 407×904-Ansichtsfenster erstellt, da dies die logischen Abmessungen meines Geräts darstellt (

Code: Select all

physical resolution ÷ DPR
). Bisher funktioniert alles wie erwartet – die Inhalte werden korrekt angezeigt, genau wie auf meinem echten Gerät.
Um mein Verständnis zu vertiefen, habe ich versucht, den DPR-Wert im entsprechenden Feld in DevTools zu ändern. Mir ist jedoch aufgefallen, dass die gerenderte Ausgabe unabhängig vom eingegebenen DPR-Wert gleich bleibt. Es fühlt sich an, als ob der Anteil des gerenderten Inhalts unabhängig von der DPR-Einstellung ist, als würden nur die Spezifikationen meines aktuellen Monitors (die konstant sind) berücksichtigt.
Ich habe dann mit anderen Ansichtsfenstern experimentiert Größen. Ich habe zum Beispiel versucht, die ursprünglichen Abmessungen auf 814×1808 zu verdoppeln und den DPR auf 1,5 angepasst (um den gleichen Maßstab beizubehalten). Allerdings entsprach die Ausgabe bei weitem nicht den ursprünglichen Proportionen. Da frage ich mich, ob 407×904 die einzige Kombination ist, die ich verwenden kann, um die genauen Proportionen meines Geräts in Chrome DevTools zu simulieren.
Zusammenfassend:
  • Ist 407×904 die einzige gültige Ansichtsfenstergröße, um die genauen Proportionen meines Geräts zu simulieren, oder gibt es alternative Ansichtsfenster? /DPR-Kombinationen, die dasselbe bewirken würden Ergebnisse?
  • Warum scheint eine Änderung des DPR in DevTools keine Auswirkungen auf die gerenderten Proportionen zu haben?
Jede Einblicke wären sehr dankbar! Vielen Dank.

Quick Reply

Change Text Case: 
   
  • Similar Topics
    Replies
    Views
    Last post