本文深入解析了CSS中的四种定位方式：absolute、fixed、relative和sticky。详细介绍了每种定位方式的特点和使用场景，如absolute相对于非static定位的父元素定位，fixed相对于浏览器窗口定位，relative相对于自身初始位置定位，以及sticky在滚动过程中固定位置的效果。
absolute
生成绝对定位的元素，相对于 static 定位以外的第一个父元素进行定位。
元素的位置通过 “left”, “top”, “right” 以及 “bottom” 属性进行规定。
卷轴拉伸页面可以拖动
fixed
生成绝对定位的元素，相对于浏览器窗口进行定位。
元素的位置通过 “left”, “top”, “right” 以及 “bottom” 属性进行规定。
是固定的 卷轴 也不能改变 固定位置
relative
生成相对定位的元素，相对于其正常位置进行定位。
因此，“left:20” 会向元素的 LEFT 位置添加 20 像素。
/* absolute会根据relative里定位 /
/ 跟static很像 都是相对的定位 根据html页面排版和相对于其他位置定位 不同的是可以设置left… */
sticky
设置top =0
在卷动的过程中就会固定在顶部 很多网站导览列的效果
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
