可变高度的自举div

Question

我正在创建其中一个滚动网站，您只需向下滚动页面即可。我的页面交替黑白背景。

我有以下页面：

<div class="row> 
<div class="col-xs-9 introduction"> 
    <p> TEXT </p> 
</div> 
</div> 

与下面的CSS：

.introduction { 
height: 120%; 
padding-top: 150px; 
text-align: center; 
background: #eee; 
min-height: 800px; 

}

我的问题是，当我让我的浏览器的窄不够，窗口我的介绍部分中的TEXT溢出白色背景并溢出到黑色部分。 如何指定类的大小以便所有文本总是在白色背景内？ 谢谢！

Answer 1

这是因为你无法阅读文档。

<div class="col-xs-9 introduction"> 
    <p> TEXT </p> 
</div> 

在这里，在这个代码这个类的COL-XS-9'，XS是用来确保该列在任何时候都保持水平，所以你的响应设置不妥善安排，他们应该是这样。

我建议你阅读有关网格系统的文档。

使用这个代替

<div class="col-md-9 introduction"> 
    <p> TEXT </p> 
</div> 

它不会给你任何问题。

Answer 2

可以使用溢出文本父

要隐藏文本或作出滚动

或者你可以使用nicescroll VS slimscroll

Overflow MDN

Answer 3

你可以试试这个CSS修复：

.introduction { 
height: 100vh; 
padding-top: 150px; 
text-align: center; 
background: #eee; 
max-height:100%; 
}