我试图解决的问题很简单,但我发现很难用CSS技术实现我想要的东西.
我想要的是有一些父级div,其高度设置为相对值(如：100％或30％).请不要问为什么我需要它,因为这只是一个部分和解释整个布局超出了这个问题.
在这个父级内部,我需要一个标题h1后跟包含大量文本的子div.最重要的是,我只需要在子div内部设置滚动条,这样标题将始终保持连接到容器的顶部.
标记：
<div class="wrapper">
<h1>Test</h1>
<div class="text">
Lorem ipsum (... lots of text)
</div>
</div>
解决方法
你想要实现
this的东西吗？
HTML
HTML
<div class="wrapper">
<div class="header">
HEADER
</div>
<div class="content">
Lorem ipsum (... lots of text)
</div>
</div>
CSS
html,body {
height: 100%;
margin: 0px;
padding: 0px;
}
.wrapper {
width: 400px;
height: 100%;
background-color: #fec;
margin: auto;
position: relative;
}
.header {
height: 40px;
background-color: green;
color: #fff;
}
.content {
position:absolute;
bottom:0px;
top: 40px;
width:100%;
overflow: auto;
background-color: #333;
color: #666;
}
