xcode 和 ipad 媒体查询

Question

我花了几天的时间来寻找使用 UIwebview 进行 ipad 媒体查询的解决方案。 我尝试过设备纵横比、不同的最小/最大宽度或设备宽度。 在 Xcode 中，模拟器或我的 Ipad 似乎就像 Iphone 一样。 加载到我的域中的网页在 ipad 上正常运行。

看来问题出在xcode

我有

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

在html页面中

CSS：

@media all
and (max-width: 667px)
{
body::before{ content: "phone fired"}
h1{
color: #F0F;
}
}

@media all
and (min-width: 768px)
and (max-width: 1024px)
{
body::before{ content: "ipad fired"}
h1{
color: #F0F;
}
}

如果我从 css 中取出 min-width: 768px，Iphone 和 Ipad 都会显示 Ipad，因为 Iphone 在 1024px 内； 使用 min-width: 768px 时，Iphone 动作正确，但 Ipad 显示“电话已启动”。它的作用就像它的宽度小于 768px

Answer 1

1. 您的定位设备是什么？

   • 检查Target中的设置 => General => Devices

   如果您仅针对 iPhone，应用程序在 iPad 上以iPhone mode 运行，您不会在此处获得不同的device size。因此，您需要选择 Universal，以本地定位两者。

   这在我的测试项目中起到了作用:-)

2. 您还应该在定位屏幕时使用@media only screen。这可能根本不是问题，但在某种程度上更正确。

3. 在检查设备的 with 时，您应该使用 min-device-width 而不是 min-width。

如果这对您没有帮助，请告诉我。那我再去看看。