position

css中的position后面的定位的不同用法与区别：

Static:静态定位可以理解为没有定位；是position属性的默认值，元素正常显示在页面排版中；

Relative（相对定位）:元素相对自身的位置进行偏移也就是相对于自身来说在文档中出现的位置来移动，可以通过（top、right、bottom、left）属性来移动元素，偏移后原本的位置空间依然保留，只是视觉上相对原来的位置有移动。

Absolute（绝对定位）:生成绝对定位元素，此元素脱离文本流不在文档中占据位置，以页面的左上角通过（top、right、bottom、left）属性进行定位。也可选取父级定位对象进行定位

Fixed:该元素将从普通文档流中删除，并且不会为页面布局中的元素创建空间。

官方：

static元素根据文档的正常流程定位。的top，right，bottom，left，和z-index性能有任何影响。这是默认值。relative该元件根据文档的正常流动定位，然后偏移相对于它本身的基础上的值top，right，bottom，和left。偏移量不会影响任何其他元素的位置; 因此，页面布局中为元素给出的空间与位置相同static。当值不是时，此值将创建新的堆叠上下文。它在影响，，，，和元素是不确定的。z-indexautotable-*-grouptable-rowtable-columntable-celltable-captionabsolute该元素将从普通文档流中删除，并且不会为页面布局中的元素创建空间。它相对于其最近的祖先（如果有的话）定位; 否则，它相对于初始包含块放置。其最终位置是由的值确定的top，right，bottom，和left。当值不是时，此值将创建新的堆叠上下文。绝对定位框的边距不会与其他边距一起折叠。z-indexautofixed该元素将从普通文档流中删除，并且不会为页面布局中的元素创建空间。它相对于所述初始位置包含块通过所建立的视口除了当它的祖先中的一个具有，transform，perspective，或filter属性设置为比其他的东西none（见CSS转换规格），在这种情况下祖先表现为包含块。（请注意，存在与浏览器的不一致性perspective和filter有助于包含块的形成。）其最终位置是由的值确定的top，right，bottom，和left。此值始终创建新的堆叠上下文。在打印文档中，元素放置在每个页面上的相同位置。sticky该元件根据文档的正常流动定位，然后偏移相对于它的最近的祖先滚动和包含块（最接近的块级祖先），包括表相关的元素的基础上的值top，right，bottom，和left。偏移量不会影响任何其他元素的位置。此值始终创建新的堆叠上下文。需要注意的是粘性元素“大棒”，以具有“滚动机制”，其最近的祖先（创建时overflow是hidden，scroll，auto，或overlay），即使祖先是不是最近的实际滚动的祖先。这有效地抑制了任何“粘性”行为。