[Hinweise] Der @ media-Bildschirm hat keine Auswirkungen auf die Browser-Entwicklungstools

Gerade als ich die CSS-Syntax angepasst habe,Ich weiß nicht, warum,Nachdem die Auflösung als Handyauflösung simuliert wurde,Die Version zeigt nicht den Effekt, den RWD haben sollte,Zuerst dachte ich, dass die @ media-Bildschirmsyntax nicht wirksam wird,Nach wiederholten Tests,Es wurde festgestellt, dass die Breitengrammatik nicht der Änderung des Auflösungsverhältnisses folgte (Bereits auf Auto eingestellt oder maximale Breite verwenden)。Später habe ich versucht, den "Web Developer" -Modus zu schließen”Berühren Sie die Simulation”Eigenschaften,Wird normal sein,Ich weiß nicht, warum dies so ist。

Firefox
Aktivieren Sie die Touch-Simulation

 

Schalten Sie die Berührungssimulation aus

 

Kante (Chrom) Einstellmethode
1. Punkt"…"
2. Wählen Sie "Gerätetyp hinzufügen"

1. Gerätetypauswahl "Responsive"
2. In "Gerätetyp" von “Handy, Mobiltelefon” 改成 “Desktop” zu。

 

《2024/02/23 更新》

後來找出原因網站在 HTML Head 有定義 viewport 的 meta tag如下

<meta name="viewport" content="width=device-width" />

但沒有定義 initial-scale 比例因此補上就可以了

<meta name="viewport" content="width=device-width, initial-scale=1" />

 

Referenz [link]

Leave a Comment

Bitte beachten Sie,: Kommentar Moderation ist aktiviert und kann Ihren Kommentar verzögern. Es besteht keine Notwendigkeit zur Stellungnahme reichen Sie.