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

您可以为文本父级使用溢出

隐藏文字或滚动

或者您可以使用nicescroll vs slimscroll

Answer 2

您可以尝试使用此css进行修复：

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

Answer 3

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

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

此代码中的此类＆＃39; col-xs-9＆＃39;，xs用于确保列始终保持水平，因此您的响应设置不会按照它们的方式正确排列应该。

我建议您稍微阅读有关网格系统的文档。

使用此代替

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

它不会给你任何问题。