我有一个针对移动设备的网页（例如iPhone和Android）。此页面有<iframe>（显然包含要呈现的其他网页）。在iPhone上，页面（和iframe）渲染正常。我设置了<meta name="viewport" content="width=device-width" />，它应该将视口宽度设置为大约320ish（或者现在使用的任何safari）。但是我的iframe中的内容宽度超过320像素。
这会导致问题，因为iframe会被截断。 iPhone网络浏览器仅显示iframe内容的左侧。由于我有width=device-width，因此我无法向左或向右滚动/平移以查看其余内容。我也无法缩小/“为自己提供更多的屏幕空间”。
我可以通过设置一个宽视口（例如width=800"）来解决这个问题，这可以确保iframe可见。但是（a）页面的其余部分看起来更糟，因为它比它应该更宽，而且（b）我不确定我是否可以依赖它总是适合800 px，所以我不能确定这将解决所有问题
无论如何都要确保始终能够看到iframe的内容，并且最好是热衷于width=device-width
FTR我正在使用iPhone 3.这个问题在Android（2.2）上不会发生，默认的网络浏览器会将iframe的内容“溢出”到iframe之外，你可以向左/向右滚动。 / p>
答案 0 :(得分：2)
我的HTML 5网络应用程序遇到了同样的问题。
将overflow: auto; -webkit-overflow-scrolling:touch;添加到iframe容器的样式中将允许在iOS 5中滚动，但这可能无法100％解决您的问题，因为现在我的iframe未在可滚动区域中呈现内容。
编辑：此解决方案（归功于原始用户）是iframe的绝佳替代方案： https://stackoverflow.com/a/8529312/1101107