我目前开始对我的网站使用响应式方法。我发现http://fluidbaselinegrid.com/是最好的样板文件。但是对于我尝试过的每个样板或网格，当您从纵向模式切换到横向模式时，我无法让 iPhone 或 iPad 识别媒体查询。
它总是在您加载页面的方向上加载正确的 css。但是当您从纵向转到横向时，它会挂起并且无法正确调整大小。
您甚至可以在http://fluidbaselinegrid.com/上看到这种情况。
有谁知道这是否是我们现在必须忍受的移动 webkit 的一个怪癖，或者有没有办法解决这个问题？
我联系了Fluid Baseline Grid背后的开发人员并得到了这个答案：
我认为您正在经历的是视口元标记。
当前的：
最大比例不允许用户用手指捏放大/缩小。但是，当设备从纵向更改为横向时，它可以防止布局发生变化。这是特意删除的，以帮助那些可能有阅读较小文本障碍的人。您可以简单地更改头部中的元标记来设置比例，这将解决当您从纵向旋转到横向时的缩放问题。
“如果 Web 开发人员希望他们的比例设置在 iPhone 上切换方向时保持一致，他们必须添加一个最大比例值来防止这种缩放，这有时会产生阻止用户放大的不良副作用” - http：/ /hacks.mozilla.org/2010/05/upcoming-changes-to-the-viewport-meta-tag-for-firefox-mobile/
这肯定解决了这个问题，但似乎你不能用手指捏缩放并控制布局切换的方式。有没有办法解决这个问题？
我解决了仅将“initial-scale=1”（而不是“maximum-scale=1”）添加到视口元标记的问题