Question

你好我的标题有问题，好像位置是固定的，它不会滚动。

     header.masthead {
     position: initial;
     width: 100%;
     min-height: auto;
     text-align: center;
     color: white;
     overflow:scroll;
     background-position: center;
     -webkit-background-size: cover;
     -moz-background-size: cover;
     -o-background-size: cover;
     background-size: cover; }"

Answer 1

正如评论中已经说过的那样，你应该设置div的高度。您可以使用像素，ems或其他设置它。如果没有指定的高度，您的内容将只是放大标题而不滚动。

Test live, version 1

Test live, version 2, better

另外，看看最小高度和最大高度。

<header class="masthead">
     <p>I'm a header</p>
     <p>I'm a header</p>
     <p>I'm a header</p>
     <p>I'm a header</p>
     <p>I'm a header</p>
</header>

<style>
header.masthead {
     position: initial;
     width: 100%;
     min-height: auto;
     text-align: center;
     color: red;
     overflow: scroll;
     background-position: center;
     -webkit-background-size: cover;
     -moz-background-size: cover;
     -o-background-size: cover;
     background-size: cover;
     height: 3em;
}

header.masthead p {
     margin: 0;
}
</style>

Answer 2

您需要设置身高。

请参阅代码段：

＆＃13;

   .masthead {
     position: initial;
     width: 100%;
     min-height: auto;
     text-align: center;
     color: white;
     overflow:scroll;
     background-position: center;
     -webkit-background-size: cover;
     -moz-background-size: cover;
     -o-background-size: cover;
     background-size: cover; 
     background: red;
     height: 200px;
     }

＆＃13;

<div class="masthead">aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</div>

＆＃13;

Answer 3

首先尝试将修复高度设置为标题div，然后将标题div的CSS应用为

overflow : auto

或

overflow : scroll

我的标题div不会滚动

3 个答案: