我有一个针对移动设备（例如 iPhone 和 Android）的网页。该页面有一个<iframe>（这显然包括另一个要渲染的网页）。在 iPhone 上，页面（和 iframe）呈现正常。我已经设置了<meta name="viewport" content="width=device-width" />，这应该使它将视口宽度设置为大约 320ish（或 safari 现在使用的任何宽度）。然而，我的 iframe 中的内容宽度超过 320 像素宽。
这会导致问题，因为 iframe 被截断。 iPhone Web 浏览器仅显示 iframe 内容的左侧。既然我有width=device-width，我无法向左或向右滚动/平移以查看其余内容。我也无法缩小/缩小以“给自己更多的屏幕空间”。
我可以通过设置宽视口来解决这个问题（例如width=800")，这确保了 iframe 可见。但是 (a) 页面的其余部分看起来更糟，因为它比应有的宽度要宽，并且 (b) 我不确定我是否可以依赖它始终适合 800 像素，所以我不能确定这会解决所有问题。
无论如何，是否有办法确保 iframe 的内容始终可见，并且最好热衷于width=device-width
FTR 我使用的是 iPhone 3。这个问题不会发生在 Android (2.2) 上，默认的 Web 浏览器会将 iframe 的内容“溢出”到 iframe 之外，您可以向左/向右滚动。
我的 HTML 5 Web 应用程序也遇到了同样的问题。
Adding overflow: auto; -webkit-overflow-scrolling:touch;iframe 容器的样式将允许在 iOS 5 中滚动，但这可能无法 100% 解决您的问题，因为现在我的 iframe 没有在可滚动区域中渲染内容。
编辑：这个解决方案（归功于原始用户）是 iframe 的一个很好的替代方案：https://stackoverflow.com/a/8529312/1101107 https://stackoverflow.com/a/8529312/1101107
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
