div可以使用固定div进行滚动

Question

我正在试图弄清楚如何基于旧索引设置基本页面设置，固定标题/导航栏div，例如200px高度。下面的第二个div与页面内容应该是可滚动的，并适合浏览器窗口内的剩余垂直空间。有什么建议吗？

Answer 1

将overflow: hidden;添加到您的CSS部件，这将使div不可滚动！ overflow: auto;让Div再次滚动

实施例： https://jsfiddle.net/v596fvbu/

Answer 2

您可以固定导航栏并让身体在其下方滚动：

.navbar {
  height: 3em;
  width: 100%;
  position: fixed;
}

或将页面高度限制为浏览器窗口大小，并使第二个div可滚动：

.page {
  overflow-y: scroll;
  height: calc(100vh - 3em); /* browser viewport height minus the navbar height */
}

http://codepen.io/helb/pen/EWjPqJ

请注意滚动条放置的区别：

http://codepen.io/helb/pen/NpqNxy