1. position 有哪些属性

1. 首先我们应该有一个总结性回答: position 一共有 6 个属性 。

2. 分别是:static、relative、absolute、fixed、sticky、inherit 。

3. 各个属性对应的含义:
   1. position: static; 默认值
   2. position: relative; 相对定位
   3. position: absolute; 绝对定位
   4. position: fixed; 固定定位
   5. position: sticky; 粘性定位
      1. 对象在常态时遵循常规流; 它就像是 relative 和 fixed 的合体, 当在屏幕中时按常规流排版, 当卷动到屏幕外时则表现如 fixed; 该属性的表现是现实中你见到的吸附效果 。
   6. position: inherit; 继承

2. position 的 absolute 与 fixed 共同点与不同点

1. 相同:
   1. 改变行内元素的呈现方式, display 被置为 block 。
   2. 让元素脱离普通流, 不占据空间 。
   3. 默认会覆盖到非定位元素上 。
   
2. 区别:
   1. absolute 的 "根元素" 是可以设置的(可以设置它的父元素或者祖先级元素); 而 fixed 的 "根元素" 固定为浏览器窗口 。
   2. 当你滚动网页, fixed 元素与浏览器窗口之间的距离是不变的 。
   

这里我就不一一去演示它的效果了, 感觉没有必要 。因为它在我们工作中使用到的频率还是比较大的 。

之前有整理过部分知识点, 现在将整理的相关内容, 验证之后慢慢分享给大家; 这个专题是 "前端面试题" 的相关专栏; 大概会有200+的文章。

如果对大家有所帮助，可以点个关注、点个赞; 文章会持续打磨 。

有什么想要了解的前端知识, 可以在评论区留言, 会及时分享所相关内容 。