CSS之定位（粘滞定位）

最新推荐文章于 2023-05-02 21:00:00 发布

不动声色的小蜗牛

最新推荐文章于 2023-05-02 21:00:00 发布

阅读量1.7k

点赞数

分类专栏： CSS 文章标签： css

本文链接：https://blog.csdn.net/weixin_45720626/article/details/107379444

版权

CSS 专栏收录该内容

22 篇文章 0 订阅

订阅专栏

粘滞定位：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>粘滞定位</title>
		<style>
			body{
				height: 3000px;
			}
			/*
				粘滞定位
					-当元素的position属性值设置为sticky时开启元素的粘滞定位
					-粘滞定位和相对定位的特点基本一致，不同的是粘滞定位可以在元素达到某个位置时将其固定
					
			 */
			.box1{
				height: 100px;
				margin-top: 200px;
				background-color: aquamarine;
				position: sticky;
				top: 10px;
			}
		</style>
		
	</head>
	<body>
		<div class="box1"></div>
	</body>
</html>