Html 如何在bootstrap中不使用滚动条按百分比排列div的高度

我想制作一个内容框，使其具有响应性。我可以用百分比设置Div s的宽度（例如：30%，50%）。但当我设置高度百分比时，它不起作用。 我想把我的页面分成3个div，以我页面的百分比表示

.top
{
高度：250px；
/*身高：28%*/
背景色：#dad8c3；
宽度：100%；
}
.身体部位{
宽度：100%；
背景色：#9CC；
高度：560px；
/*身高：60%*/
背景：-webkit线性梯度（-90度，#e4e0dd，白色，#e4e0dd）；/*用于Safari 5.1至6.0*/
背景：-o-线性梯度（-90度，#e4e0dd，白色，#e4e0dd）；/*用于Opera 11.1至12.0*/
背景：-moz线性渐变（-90度，#e4e0dd，白色，#e4e0dd）；/*适用于Firefox 3.6至15*/
背景：线性渐变（-90度，#e4e0dd，白色，#e4e0dd）；/*标准语法（必须是最后一个）*/
}
.页脚部分{
背景色：#6c5067；
宽度：100%；
高度：97px；
/*身高：12%！重要*/
}
html，正文{
背景图像：url（../images/moment%20a.jpg）；
身高：100%；
}

您可以使用unit执行以下操作：

html，
body，body>div{
填充：0；
保证金：0；
}
.顶{
高度：28vh；
背景色：#dad8c3；
}
.身体部位{
背景色：#9CC；
高度：60vh；
背景：-webkit线性梯度（-90度，#e4e0dd，白色，#e4e0dd）；
/*适用于Safari 5.1至6.0*/
背景：-o-线性梯度（-90度，白色，#e4e0dd）；
/*歌剧11.1至12.0*/
背景：-莫兹线性梯度（-90度，#e4e0dd，白色，#e4e0dd）；
/*适用于Firefox 3.6至15*/
背景：线性梯度（-90度，#e4e0dd，白色，#e4e0dd）；
/*标准语法（必须是最后一个）*/
}
.页脚部分{
背景色：#6c5067；
高度：12vh；
}

谢谢，它可以工作，但我想在最小化页面高度时避免滚动条。现在，当我把这个窗口缩小时，我看不到页脚部分。我没有看到滚动条（在chrome和firefox中），我将所有3个div的边距设置为0，页脚高度应始终为页面高度的12%。thanx对于你的评论，我尝试过这样做。大屏幕中没有滚动条。但当它来到小屏幕滚动条来的高度。但是没有宽度滚动条，因为这是一个引导页面。有什么方法解决这个问题吗？Thanx检查引导网格文档；你把你的标记搞砸了。。。