普通文档流中margin影响元素间距与居中，绝对/固定定位时结合偏移属性调整位置，且margin不影響z-index堆叠顺序。
外边距（margin）在CSS布局中对元素的定位有直接影响，尤其当元素使用不同的定位方式时，margin的作用表现也不同。理解这一点有助于更精准地控制页面布局。
普通文档流中的margin作用
对于静态定位（static）或相对定位（relative）的元素，margin会在其原本占据的空间之外添加空白，推动其他相邻元素远离它。
这类元素仍处于文档流中，margin会参与正常的盒模型计算：
- 左右margin影响水平布局，可能导致元素之间产生间隔或换行
- 上下margin可能发生“塌陷”（margin collapsing），取最大值而非相加
- 设置margin: auto可实现水平居中（需配合宽度）
绝对定位元素中的margin行为
当元素设置为position: absolute时，它脱离文档流，其位置由最近的定位祖先决定。此时margin依然生效，但作用方式有所不同。
立即学习“前端免费学习笔记（深入）”；
margin在绝对定位元素上可以用来微调位置，或者与其他偏移属性（如top、left）配合使用：
- margin会进一步推离元素的实际渲染位置
- 若设置了top: 0; left: 0;，再加margin: 20px;，元素将从左上角偏移20px
- 使用margin: auto结合top/left/right/bottom可实现居中（例如模态框居中）
固定定位元素的margin特性
固定定位（fixed）元素相对于视口定位，不受滚动影响。它的margin表现与绝对定位类似。
常见应用场景包括顶部导航栏或侧边工具栏：
- margin可用于避免与浏览器边缘或其他固定元素重叠
- 设置margin: 10px;能让固定按钮距离窗口边缘保持间距
- 同样支持auto居中，比如水平居中：left: 0; right: 0; margin: 0 auto;
z-index与margin的无关性说明
需要注意的是，margin只影响元素在平面内的位置和空间占用，不影响堆叠顺序。即使一个元素有大margin，也不会改变它在z轴上的层级。
堆叠层级由z-index和定位上下文决定，与margin无直接关系。
基本上就这些。合理使用margin能增强布局灵活性，但在定位元素上要结合top、left等属性综合考虑最终效果。不复杂但容易忽略细节。
