[ملاحظات]media screen ليس لها أي تأثير في أدوات تطوير المتصفح

فقط عندما قمت بتعديل بناء جملة CSS,不知道為什麼,بعد محاكاة دقة دقة الهاتف المحمول,لا يُظهر الإصدار التأثير الذي يجب أن يكون لـ RWD,في البداية اعتقدت أن صيغة الشاشةmedia لم تدخل حيز التنفيذ,بعد الاختبار المتكرر,وجد أن عرض النحو النحوي لا يتبع تغيير نسبة الدقة (مضبوط بالفعل على تلقائي أو استخدم max-width)。لاحقًا ، حاولت إغلاق وضع "Web Developer"”محاكاة اللمس”المميزات,سيكون طبيعيا,لا أعرف لماذا يؤثر ذلك بهذه الطريقة。

فايرفوكس
قم بتشغيل محاكاة اللمس

 

قم بإيقاف تشغيل محاكاة اللمس

 

حافة (الكروم) طريقة التعديل
1. نقطة"…"
2. حدد "إضافة نوع الجهاز"

1. اختيار نوع الجهاز "مستجيب"
2. في "نوع الجهاز" من “التليفون المحمول” 改成 “سطح المكتب” إلى。

 

《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" />

 

【參考連結】

اترك التعليق

يرجى ملاحظة: الاعتدال هو مكن تعليق، وربما تؤخر تعليقك. ليست هناك حاجة لإعادة تعليقك.