定位类型的分类

Posted 2020-09-15

首先，我们学习定位元素的几种方法以及他们的区别。定位类型有四种，通过position属性指定，分别是static (默认值)、relative、absolute 以及fixed. 四种定位方式的含义分别为:

静态定位(static)表示按照正常定位方案，元素盒按照在文档流中出现的顺序依次格式化；

相对定位（relative）将移动元素盒，但是它在文档流中的原始空间会保留下来；

绝对定位（absolute）是指元素盒彻底从文档流脱离出来，并相对于其容器块进行定位。因为这些元素从文档流中脱离出来，所有他们不再影响周边元素的布局，并且它们会占据的空间不被保留。

固定定位（fixed）与绝对定位类型，元素从文档流中脱离，但是它们不是相对于容器块定位，而是相对于视口（viewpoint）

定位（大多数情况下，这个视口是指浏览器的窗口）。