CSS sticky
CSS sticky
CSS position属性用于设置元素的位置。它还用于将项目放置在另一个元素后面，并且对于脚本化动画效果很有用。
" position:sticky;" 用于根据用户的滚动位置定位元素。
" position:sticky;" 用于根据用户的滚动位置定位元素。
此CSS属性允许元素在滚动到某一点。取决于滚动位置，粘性元素会在
fixed和
relative"之间切换。元素将被定位为
relative ，直到指定的offset位置为在视口中相遇。然后，类似于
position:fixed （固定位置），该元素停留在一个位置。
fixed和
relative"之间切换。元素将被定位为
relative ，直到指定的offset位置为在视口中相遇。然后，类似于
position:fixed （固定位置），该元素停留在一个位置。
让我们尝试使用插图来了解此CSS属性。
示例
<!DOCTYPE html>
<html>
<head>
<style>
body {
text-align: center;
}
.stick {
position: sticky;
top: 50px;
padding: 10px;
font-size: 20px;
font-weight: bold;
background-color: lightblue;
border: 1px solid blue;
}
</style>
</head>
<body>
<h1>Scroll and see the effect!</h1>
<div class="stick">Sticky Element</div>
<div style="padding-bottom:2000px">
<h2>Hello World</h2>
<h2>Welcome to bianchenghao6.com</h2>
</div>
</body>
</html>
输出：
