CSS position属性

position属性
规定应用于元素的定位方法的类型
五个不同的位置值：

- static
- relative
- fixed
- absolute
- sticky

元素其实是使用top、bottom、left和right属性定位的，但是，除非首先设置了position属性，否则这些属性将不起作用，根据不同的position值，他们的工作方式也不同

position:static;（静态定位）
1、HTML元素默认情况的的定位方式
2、不受top、bottom、left和right属性的影响
3、根据页面的正常流动进行定位

position:relative;(相对定位)
如果一个元素进行相对定位，他将出现在它所在的位置上
可以通过设置垂直或水平位置，让这个元素“相对于它的起点进行移动，且原本所占的空间仍保留

position:fixed(固定定位)
1、相对于视口定位。即：即使有滚动页面，它也始终位于同一位置
2、top、bottom、left和right属性用来定位此元素

position:absolute;(绝对定位)
绝对定位使元素的位置与文档无关，因此不占据空间
1、相对于最近的定位祖先元素进行定位
注意：“被定位的”元素是其位置除static以外的任何元素
2、绝对定位的框与文档流无关，所以他们可以覆盖页面上的其他元素

position:sticky;(粘性定位)
1、根据用户的滚轮位置进行定位
2、必须至少指定top、right、bottom、left之一，以便粘性定位起作用
注意：Internet Explorer、Edge 15 以及更早的版本不支持粘性定位。 Safari 需要 -webkit- 前缀