Html 设置媒体查询中屏幕的最小宽度vs视口标记

简单地“缩小”一个站点以适应iPad，同时让它在手机方面完全响应，最好的方法是什么

这是我的视口标记：

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

媒体查询本身可以工作（包装器背景在iPad上变为红色），但我仍然需要缩小以查看整个页面

但是，如果将视口标记更改为：

<meta name="viewport" content="width=1080px">

我得到了期望的结果，但这并不好，因为移动版本需要完全响应。所以我希望我可以在媒体查询中添加一些东西来实现它

当然，我在这里遗漏了一些非常明显的东西——而且似乎还记得这项技术在过去是有效的——感谢您的帮助

非常感谢

编辑：

似乎以前也提出过同样的问题，但没有解决方案：

---

尝试添加缩放比例：

恐怕没有乐趣-页面仍处于相同的缩放比例，这只是停止了任何缩放。可能iPad模拟了“错误”的值

设备宽度

。我知道Windows Phone确实模拟了更小的分辨率（320px而不是480px），因为大多数移动优化网站都没有针对如此高像素密度的屏幕进行优化。你的css毫无意义。你说的是当

最大设备宽度：1024px

make

body{min width:1080px；}

我的建议是：对于

（最小设备宽度：768px）和（最大设备宽度：1024px）

我会做百分比并将其缩小，以适应ipad和平板电脑中的网站，或者设置最小宽度并使溢出可见，这样你就可以滚动（这对某些人来说很烦人）。然后在下面

768px

设备-做百分比并进一步缩小

<meta name="viewport" content="width=1080px">