Justo cuando ajusté la sintaxis CSS,不知道為什麼,Después de que la resolución se simula como la resolución del teléfono móvil,La versión no muestra el efecto que debería tener RWD,Al principio pensé que la sintaxis de la pantalla @media no surtía efecto,Después de varias pruebas,Se encontró que la gramática de ancho no siguió el cambio de relación de resolución (Ya está configurado en automático o usa el ancho máximo)。Más tarde, intenté cerrar el modo "Desarrollador web".”Simulación táctil”Caracteristicas,Será normal,No sé por qué afecta de esta manera。
Firefox
Encienda la simulación táctil
Desactivar la simulación táctil
Borde (Cromo) Método de ajuste
1. punto"…"
2. Seleccione "Agregar tipo de dispositivo"
1. Selección del tipo de dispositivo "Responsive"
2. En "tipo de dispositivo" de “Móvil” Cambiado “Escritorio” para。
《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" />
【參考連結】
- En Google Chrome, ¿Dónde está la capacidad de deshabilitar la emulación del sensor táctil?? – Quora
- Responsive Web Design 基礎 : Conjunto | by Amdis Liu | Frochu | Medium