我在 iPhone 上以横向模式查看页面时遇到问题(在 SE 型号上测试，但似乎很多人在其他 iPhone 上遇到同样的问题)。
我在下面做了一个例子，它是一个简单的网页，有两行文本，一行文本在顶部，一行在底部。
问题是，当我在正常模式下查看页面时，一切看起来都很好，但是当在横向模式下旋转手机时，地址栏覆盖了页面顶部，工具栏覆盖了页面底部。我添加了一些 javascript 来滚动页面，以便它从地址栏下方开始，但由于页面现在向下滚动，所以最后一行隐藏在工具栏后面。
我已经测试了很多元标记和不同的 css hack，但都没有用。
我只想在转到此页面时显示两个文本，我不想滚动，但只是为了了解信息，我希望稍后能够在页面上放大，这样解决方案就不会阻止缩放在页面上。
代码:
<html>
<meta content="width=device-width, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" name="viewport" />
<script>
window.addEventListener("load",function() {
setTimeout(function(){
window.scrollTo(0, 1);
}, 0);
});
window.addEventListener("resize",function() {
setTimeout(function(){
window.scrollTo(0, 1);
}, 0);
});
</script>
<style>
div {
position: absolute;
bottom: 0;
margin: auto;
}
</style>
<body>
Top
<div>
Bottom
</div>
</body>
</html>
最佳答案
尝试添加meta viewport喜欢，
<meta name="viewport" content="width=device-width, initial-scale=1">
另请阅读 Using the Viewport
关于javascript - 不正确的高度iphone，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/44411385/