博文纲领：
- 1、详解CSS的相对定位和绝对定位
- 2、css的定位
- 3、CSS定位的4种分类
详解CSS的相对定位和绝对定位
绝对定位和相对定位的使用场景也有所不同。相对定位适用于需要调整元素位置但又不想影响其他元素布局的情况，而绝对定位则适用于需要创建复杂的布局结构，或者需要将某些元素从正常的文档流中移除的情况。通过合理运用这两种定位方式，可以更好地满足网页设计的需求。
CSS中设置DIV的定位，绝对定位和相对定位的区别如下：相对定位： 参照物：相对定位的元素是相对于其正常位置进行定位的。 位置偏移：使用top、right、bottom、left属性可以使元素相对于其正常位置进行偏移。 占据空间：相对定位的元素仍然占据文档流中的原始空间。
在CSS中，通过绝对定位和相对定位实现元素在文档中的位置控制。绝对定位，元素相对于最近的已定位祖先元素定位，若无已定位祖先元素，则相对于文档最初始点定位。通过设置position： absolute与top、bottom、left、right属性完成。
相对定位和绝对定位是CSS中的两种定位方式，它们的主要区别在于参照点的不同。相对定位基于元素原本应该在的位置进行定位，而绝对定位则是基于页面的左上角进行定位。
一：绝对定位 position： absolute；绝对定位：绝对定位是相对于元素最近的已定位的祖先元素（即是设置了绝对定位或者相对定位的祖先元素）。如果元素没有已定位的祖先元素，那么它的位置则是相对于最初的包含块（body）。
css的定位
静态定位（static）默认定位方式，元素按照标准流布局，忽略 top， bottom， left， right， z-index 属性，位置由文档流决定。相对定位（relative）元素脱离标准流，但保留原有位置视觉上移动，使用 top， bottom， left， right 设置位置，层级通过 z-index 控制。
CSS中position属性用于指定元素的定位方法的类型（static、relative、absolute、fixed、sticky）。静态定位position：static此属性未HTML元素默认定位，一个元素没有以任何特殊的方式定位，它总是按照页面的正常流程定位。在此属性下，属性值top、left、right、bottom和z-index对HTML元素没有影响。
在 CSS 中，通过 position 属性定义元素的定位模式，它决定元素的定位方式。position 属性值分为四种：静态定位(static)、相对定位(relative)、绝对定位(absolute)和固定定位(fixed)。静态定位(static)：选择器 { position： static； }，元素的定位模式为静态，它不会改变元素的默认位置。
在CSS中，通过绝对定位和相对定位实现元素在文档中的位置控制。绝对定位，元素相对于最近的已定位祖先元素定位，若无已定位祖先元素，则相对于文档最初始点定位。通过设置position： absolute与top、bottom、left、right属性完成。
相对定位和绝对定位是CSS中的两种定位方式，它们的主要区别在于参照点的不同。相对定位基于元素原本应该在的位置进行定位，而绝对定位则是基于页面的左上角进行定位。
通过设置top、bottom、left、right等属性，可以调整元素的位置，使其相对于其原始位置进行移动。例如，若将top属性设置为20像素，元素就会在原来位置的基础上向下移动20像素；若将left属性设置为20像素，元素则会在其原始位置的右边移动20像素。
CSS定位的4种分类
1、静态定位（static）默认定位方式，元素按照标准流布局，忽略 top， bottom， left， right， z-index 属性，位置由文档流决定。相对定位（relative）元素脱离标准流，但保留原有位置视觉上移动，使用 top， bottom， left， right 设置位置，层级通过 z-index 控制。
2、static（静态定位）：默认值。元素在正常文档流中，忽略定位声明。relative（相对定位）：元素脱离文档流，但保持原有位置。通过top， bottom， left， right定位。absolute（绝对定位）：相对于第一个非static定位的父元素定位。通过left， top， right， bottom定位。
3、CSS元素定位主要有四种类型：静态定位（Static）、相对定位（Relative）、绝对定位（Absolute）和固定定位（Fixed）。 静态定位（Static）：这是元素的默认值，即元素在文档的正常流中定位。静态定位的元素不会受到 top， bottom， left， right等定位属性的影响。
4、静态定位(static)是默认的定位模式，元素的位置不受控制，位置保持不变。相对定位(relative)则是元素相对于其原始位置进行偏移，主要用于创建层级关系。绝对定位(absolute)是将元素相对于最近的已定位祖先元素进行定位，元素不再占据原有空间，适用于复杂的布局需求。