html - ember-bootstrap 的问题：页面背景呈现半灰色，通常应该是全白的

Question

我对 Bootstrap 有一个小问题。有时，我的页面背景是半白/半灰，但它应该是全白的。

如您所见，我的应用程序中有一些灰色背景，有人知道如何摆脱它。我对 CSS 很了解，所以如果您需要有关我的问题的任何信息，请咨询我！谢谢！

编辑这是我身体的代码：

body {
    background-color: #eee;
    padding-bottom: 35px;
}

我为每个元素的内容使用默认的页面包装器。他在任何地方都没有定义。

已解决：感谢@KieranMcClung，问题已解决。如果你愿意，你可以在评论中看到，但基本上，我在我的页面包装器中放入了如下内容：

<div id="page-wrapper" style="height: auto; min-height: 100vh">

score 1 · Accepted Answer

以下示例将确保.page-wrapper类始终处于 100% 的屏幕高度。

HTML

<body>
    <div class="page-wrapper">
        <!-- Page content -->
    </div>
</body>

CSS

body {
    background-color: #eee;
}

.page-wrapper {
    background-color: #fff;
    min-height: 100vh; /* Important bit */
}

值得注意的是，vh在某些移动浏览器上可能会产生不同的结果，因为顶部浏览器栏在滚动时会消失，这意味着屏幕高度（vh 值）会发生变化。在这些设备上进行测试时，您必须牢记这一点。

1 回答 1