我想我疯了。
我有一个网站，媒体查询和响应行为在 Chrome、Firefox 和 Safari 中调整大小时工作正常，并且在我的 Android 手机上测试正常，但出于某种我无法弄清楚的原因，它不会工作在我测试过的多部 iPhone 和 iPad 上。
回答你的第一个问题，我的视口(viewport)肯定在那里......
<meta name="viewport" content="width=device-width, initial-scale=1.0">
...我什至尝试放入所有可能的 CSS 版本以确保这不是问题所在。
@-wekbit-viewport{width:device-width;zoom:1;}
@-ms-viewport{width:device-width;zoom:1;}
@-o-viewport{width:device-width;zoom:1;}
@viewport{width:device-width;zoom:1;}
仍然没有骰子。我已经验证了我的媒体查询并且代码看起来都不错。我在这里不知所措。任何建议将不胜感激。
最佳答案
看起来在 iOS 设备上，您的网站正在向 <head> 中注入(inject)一个额外的视口(viewport)元标记。 :
<meta name="viewport" content="width=1100">
这就是我在我的 iPhone6 模拟器上看到的，它可能覆盖了您的第一个视口(viewport)元标记。我猜你有一个 WordPress 插件太聪明了，只为 iOS 设备注入(inject)这个额外的标签。我建议你的第一步应该是审核你的插件，关闭任何可能是罪魁祸首的东西，并使用 free Xcode iOS simulator 确认标签已经消失。和 debugging with Safari .
祝你好运!
关于ios - responsive/viewport 在浏览器中工作但在 ios 中不工作，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/37751711/