css - 创建占据 iPad 视口的 CSS 布局

Question

我想创建一个完全填满 iPad 视口的网页。我还想确保内容不会超出视口以防止任何页面级滚动。

我曾尝试过 1024x768 纵向布局，但最终被水平剪裁，并且页面内容超出了视口的底部边缘。

我将此添加到：

我有一个简单的#container div，它位于主体下方，样式如下：

#container {
width: 768px;
max-width:768px;
height:1024px;
max-height:1024px;
margin:0 auto;
overflow:hidden;

}

任何人都知道如何实现固定到 iPad 尺寸的布局？

谢谢！

克里斯

score 2 · Accepted Answer

这应该填满任何屏幕，也很好而且反应灵敏。

#container {
    position: absolute,
    top: 0,
    bottom: 0,
    left: 0,
    right: 0
}

score 0 · Accepted Answer

为什么你不使用 % ？

例如：

#container {
width: 50%;
height: 50%;
margin:0 auto;
overflow:hidden;
}

score 0 · Accepted Answer

如果您有权访问 HTML，则可以将元标记用于视口。

<meta name="viewport" content="width=device-width">
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">

只是一个想法。

3 回答 3