单页固定视口

Question

我目前正在制作单页滚动垂直网站，其视口锁定在100％高度。

我遇到的问题是给我的设计是针对1200x800（macbook 13“）视图计算的，但我使用的是1920x1080（macmini）分辨率。

此外，每个屏幕中的可用高度区域受浏览器使用的每个小部件的限制，因此800实际上可能是例如638高度（在ipads中更为深刻，其中768浏览器高度总共不是768 ）。此外，设计必须以宽度和高度为中心。对于宽度，我可以使用margin:0 auto，但高度比较棘手，因为它需要使div绝对。

我到目前为止所做的是将div设为绝对值并通过javascript操纵它，但我想知道 如果有纯粹的css方法可以做到 因为javascript需要很多案例和多余的代码。

Answer 1

这是我正在使用的身高和html高度为100％

<div style=" display:table;width:100%;height:100%">
    <div style="display:table-cell;vertical-align:middle;">

    </div>
</div>