修复了容器div中的文本滚动
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了修复了容器div中的文本滚动相关的知识，希望对你有一定的参考价值。
我正在开发一个html和css页面，当我滚动页面时，我无法修复文本。
我有3个div，每个都有h1标题。
是否可以滚动页面，在div移动时将标题保留在固定位置？
.corpo{
width:80%px;
height:1200px;
border: 1px solid black;
margin:20px;
margin-bottom:50px;
}<div class="corpo">
<h1> Title 1</h1>
</div>
<div class="corpo">
<h1> Title 2</h1>
</div>
<div class="corpo">
<h1> Title 3</h1>
</div>答案
最简单的方法来实现你正在寻找的是使用position: sticky并指定top取决于你想要h1相对于容器div坚持。请参阅下面的代码段以获取示例：
.corpo {
width:80%px;
height:1200px;
border: 1px solid black;
margin:20px;
margin-bottom:50px;
}
.corpo h1 {
position: sticky;
top: 20px;
}<div class="corpo">
<h1> Title 1</h1>
</div>
<div class="corpo">
<h1> Title 2</h1>
</div>
<div class="corpo">
<h1> Title 3</h1>
</div>以上是关于修复了容器div中的文本滚动的主要内容，如果未能解决你的问题，请参考以下文章