保存到主屏幕时，网站在 iOS4 上的 iPhone 上宽度错误
我有一个一个网站，在 iPhone 上的 Safari 中查看时效果很好。在 iOS3.x 中，您可以将其另存为主屏幕的图标，并且可以正常打开。
但在 iOS4 中，虽然它在 Safari 中看起来仍然是正确的宽度，但如果您直接从主屏幕图标打开它，那么它就太宽了。
我花了几个小时摆弄视口元标记的各种设置和 CSS 调整，但没有任何乐趣。谁能看出哪里出了问题，或者为什么 iOS4 与 iOS3 会有所不同？
I have a website that looks fine when viewed in Safari on an iPhone. In iOS3.x you can save it as an icon to the Home Screen and it opens fine.
But in iOS4, while it still looks the correct width in Safari, if you open it direct from a Home Screen icon then it's too wide.
I've spent a couple of hours fiddling with various settings of the viewport meta tag, and CSS tweaks, but no joy. Can anyone see what's wrong, or why it would be different in iOS4 vs iOS3?
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（3）
编辑：
我测试了一下，肯定有问题。我在这里帮不了你，但这可能与你的CSS有关。
原始答案：
这是因为当您在主屏幕上创建网络剪辑时，iPhone 会自动保存网站的当前缩放级别。如果您不希望发生这种情况，请确保在创建网络剪辑之前将其完全缩小。
EDIT:
I tested it, and something is definetely wrong. I can't help you here, but it probably has something to do with your CSS.
Original answer:
That's because iPhone automatically saves the current zoom level of the website when you create a web-clip to your home-screen. Make sure you zoom all the way out before creating the web-clip if you don't want this to happen.
我查看了你的 CSS，你正在定义宽度一组 px。尝试在您的 div（包装器、窗口、主控件等）中使用“width:100%”而不是设置的 px。当然，这意味着您必须“识别”该设备并发送不同的 css（如果它不是 iphone 上的 webview）。
现在只测试 100%，如果它有效，那么您可以开始根据正在查看页面的设备来查看重定向 css。
希望这是有道理的，如果没有让我知道。
I looked at your CSS and you are defining the width a set px. Try using "width:100%" in your divs (wrapper, window, main, etc...) instead of a set px. Of course this means you will have to "recognize" the device and send a different css if its anything other than a webview on the iphone.
For now just test the 100%, if it works then you can start to look at redirecting css depending on device that is viewing the page.
Hope this makes sense, if not let me know.
仅供参考 - 这让我发疯。我的主屏幕链接在 vn 3 上工作得非常好，但现在坏了。
我确定这是一个错误...如果/当我找到解决方案时会做出回应。
FYI - this is driving me nuts. My homescreen link worked absolutely fine with vn 3 and now it's broken.
I'm sure this is a bug... will respond if/when I figure out a fix.