position三种属性的区别

absolute:此属性定义一个横向和纵向的属性就可以控制布置的文本或图片相对于浏览器整个页面的上方或者下方和左方或者右方的距离。

relative:此属性会相对于一个正常的标题,对其进行相对位置的移动,可用left,right等对其位置进行移动,也可为负值。

fixed:此属性和absolute有相似之处,也是相对于浏览器的各种方向对其进行布局,与之不同的是当页面向下或者向右移动的时候,它相对于浏览器的页面距离仍然保持不变。

static:没有定位,元素出现在正常的流中,适用于进行正常排版,不适用于对其进行定位的操作。

sticky:当元素在容器中被滚动超过指定的偏移值时,元素在容器内固定在指定位置。如果设置了top: 50px,那么在sticky元素到达距离相对定位的元素顶部50px的位置时固定,不再向上移动,之后就相当于用fixed将它固定了。

摘自:https://www.cnblogs.com/orange123/p/9786541.html

原文地址:https://www.cnblogs.com/smartchan/p/10189316.html