position:sticky这孩子的名字叫粘性定位!!
指定定位方式并设置到浏览器顶部的距离为0。
有效代码:
position: sticky;
top: 0px;
具体实现
<body>
<div id="box">
<div>
页头!!
</div>
</div>
<style>
body{
margin: 0;
padding: 0;
}
#box{
background-color: bisque;
width: 100%;
height: 2000px;
}
#box div:nth-child(1){
width: 100%;
height: 80px;
position: sticky;
background-color: blueviolet;
top: 0px;
}
</style>
</body>