1

目前我正在为一个使用 Retina Ready Coding 的网站工作。Retina 显示器（新 iPad）的分辨率为 2048 x 1536 像素，而普通 iPad/Tab 的分辨率为 1024x768 像素。根据 Retina 定律，每当我使用 body width / container width 1536px in

@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 时，它的宽度从 1536 像素变为 768 像素。有人对此有任何解决方案吗？我在 Retina 显示移动设备上面临同样的问题。

4

2 回答 2

1

您是否使用元标记设置了视口？这种行为看起来像没有视口元标记。尝试使用此元标记更改/添加视口设置：

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

另请查看此链接以获取说明

于 2016-09-19T12:59:57.437 回答
1

问题解决了！！！

我必须使用这个元标签

<meta name="viewport" content="width=device-width, maximum-scale=1.0, user-scalable=1" />

谢谢，

于 2016-09-20T07:30:04.067 回答