如何通过滚动顺利地在引导程序中留下100%高度的div?

时间:2015-11-17 16:13:32

标签: html css twitter-bootstrap-3 height

我有一个问题。

有人可以解释我或找到高度100%的解决方案

我正在制作一个使用引导程序的网站,并希望制作三个垂直方块,所以当我放置高度:100%和最小高度:100%它有效,但当内容超出身体高度时,它激活滚动,到目前为止一直很好,但列不是100%高度。

html, body { margin:0; height: 100%;}
div { height: 100%; min-height: 100%; }

参见示例:

http://codepen.io/anon/pen/qOgvjZ

2 个答案:

答案 0 :(得分:0)

您有两种选择:

div {height:100%;最小高度:100%;溢出:隐藏;}

(新样式是溢出部分)或将thew overflow设置为scroll(overflow:scroll;)。

如果将其设置为隐藏,则额外内容将不可见,如果您将其设置为滚动,则每列都会有自己的滚动条。

答案 1 :(得分:0)

试试这个:

div { height: 100%; min-height: 100%; overflow:auto;}

overflow:auto:自动只会在裁剪任何内容时显示滚动条。

overflow:scroll:即使所有内容都适合,滚动也会始终显示滚动条,但您无法滚动它。