静态定位是元素的默认定位模型。它们显示在作为正常HTML流的一部分呈现的页面中。静态定位的元素不遵守左，上，右和底规则：

相对定位允许您指定相对于HTML流中元素的正常位置的特定偏移量(左，顶等)。因此，如果我在一个div中有一个文本框，我可以应用相对定位的文本框，以显示在特定的地方相对于它通常放置在div的位置：

还有绝对定位 – 您可以指定元素相对于整个文档的精确位置，或者指向元素树上的下一个相对定位的元素：

并且当position：relative应用于层次结构中的父元素时：

注意我们的绝对位置元素是如何被相对定位的元素绑定的。

最后是固定的。固定定位将元素限制在视口中的特定位置，该位置在滚动期间保持原位：

您还可以观察固定位置的元素不会导致滚动的行为，因为它们不被视口约束：

而绝对定位的元素仍然由视口绑定，并将导致滚动：

当然你的父元素使用overflow：？以确定滚动的行为(如果有的话)。

通过绝对定位和固定定位，元素从HTML流中取出。