使用设备宽度时,Retina 显示设备宽度不会自动适应 ipad
Retina display device width is not autofit in on ipad when using device width
目前我正在为一个使用 Retina Ready Coding 的网站工作。视网膜显示器(新 iPad)的分辨率为 2048 x 1536 像素,而通用 iPad/Tab 的分辨率为 1024x768 像素。根据视网膜定律,每当我在
中使用 body width / container width 1536px
@media only screen and (min-device-width: 768px) and (max-device-width : 1024px) and (-webkit-min-device-pixel-ratio: 2) { body{ width: 1536px !important; }, .container{ width: 1536px !important; } }.
这应该会自动将 width:1536px 调整为 768px(作为其像素比 2)。但它显示将整个站点放大到 iPad。每当我触及 iPad 时,它的宽度都会从 1536px 变为 768px。
有人对此有任何解决方案吗?我在 Retina 显示屏移动设备上遇到了同样的问题。
您是否使用元标记设置视口?这种行为看起来好像没有视口元标记。尝试 changing/adding 使用此元标记的视口设置:
<meta name="viewport" content="width=device-width">
或者这个:
<meta name="viewport" content="initial-scale=1.0">
或两者:
<meta name="viewport" content="width=device-width, initial-scale=1">
同时检查 this link for 解释
问题已解决!!!
我必须使用这个元标签
<meta name="viewport" content="width=device-width, maximum-scale=1.0, user-scalable=1" />
谢谢,
目前我正在为一个使用 Retina Ready Coding 的网站工作。视网膜显示器(新 iPad)的分辨率为 2048 x 1536 像素,而通用 iPad/Tab 的分辨率为 1024x768 像素。根据视网膜定律,每当我在
中使用 body width / container width 1536px@media only screen and (min-device-width: 768px) and (max-device-width : 1024px) and (-webkit-min-device-pixel-ratio: 2) { body{ width: 1536px !important; }, .container{ width: 1536px !important; } }.
这应该会自动将 width:1536px 调整为 768px(作为其像素比 2)。但它显示将整个站点放大到 iPad。每当我触及 iPad 时,它的宽度都会从 1536px 变为 768px。 有人对此有任何解决方案吗?我在 Retina 显示屏移动设备上遇到了同样的问题。
您是否使用元标记设置视口?这种行为看起来好像没有视口元标记。尝试 changing/adding 使用此元标记的视口设置:
<meta name="viewport" content="width=device-width">
或者这个:
<meta name="viewport" content="initial-scale=1.0">
或两者:
<meta name="viewport" content="width=device-width, initial-scale=1">
同时检查 this link for 解释
问题已解决!!!
我必须使用这个元标签
<meta name="viewport" content="width=device-width, maximum-scale=1.0, user-scalable=1" />
谢谢,