页内内容区域滚动html,html – 引导固定页眉和页脚,在流体容器中滚动体内容区域...

添加以下css以禁用默认滚动条：

body {

overflow: hidden;

}

并将#content css更改为仅在内容主体上滚动：

#content {

max-height: calc(100% - 120px);

overflow-y: scroll;

padding: 0px 10%;

margin-top: 60px;

}

编辑：

其实我不知道你面临的问题是什么,因为你的css似乎正在工作.我只添加了HTML和标题css语句：

html {

height: 100%;

}

html body {

height: 100%;

overflow: hidden;

}

html body .container-fluid.body-content {

position: absolute;

top: 50px;

bottom: 30px;

right: 0;

left: 0;

overflow-y: auto;

}

header {

position: absolute;

left: 0;

right: 0;

top: 0;

background-color: #4C4;

height: 50px;

}

footer {

position: absolute;

left: 0;

right: 0;

bottom: 0;

background-color: #4C4;

height: 30px;

}

Lorem Ipsum
Lorem Ipsum
Lorem Ipsum
Lorem Ipsum
Lorem Ipsum

Lorem Ipsum
Lorem Ipsum
Lorem Ipsum
Lorem Ipsum
Lorem Ipsum

Lorem Ipsum
Lorem Ipsum
Lorem Ipsum
Lorem Ipsum
Lorem Ipsum

Lorem Ipsum
Lorem Ipsum
Lorem Ipsum
Lorem Ipsum
Lorem Ipsum

Lorem Ipsum
Lorem Ipsum
Lorem Ipsum
Lorem Ipsum
Lorem Ipsum