答案：CSS中position属性用于控制元素定位方式，包含static（默认，按文档流排列）、relative（相对自身原位置偏移，保留原有空间）、absolute（脱离文档流，相对于最近已定位祖先元素定位）、fixed（脱离文档流，相对于视口固定位置，滚动不变）、sticky（滚动时在relative与fixed间切换，需指定阈值）。掌握各类型特点可灵活实现页面布局。
在CSS中，position 属性用于控制元素的定位方式。通过设置不同的定位类型，可以精确控制元素在页面中的位置。常用的 position 值有：static、relative、absolute、fixed 和 sticky。
1. static 定位（默认）
元素按照正常的文档流排列，top、bottom、left、right 属性无效。
大多数元素默认就是 static，不需要特别设置。2. relative 定位（相对定位）
元素相对于它原本在文档流中的位置进行偏移。设置 top、right、bottom、left 会使其移动，但原来的位置仍被保留，不会影响其他元素布局。
示例：
立即学习“前端免费学习笔记（深入）”；
.element {
position: relative;
top: 10px;
left: 20px;
}
这个元素会从原本位置向下移动10px，向右移动20px，但原来的空间还在。
3. absolute 定位（绝对定位）
元素脱离文档流，不再占据空间，相对于最近的已定位祖先元素（即 position 为 relative、absolute、fixed 或 sticky 的祖先）进行定位。如果没有这样的祖先，则相对于初始包含块（通常是视口）。
示例：
立即学习“前端免费学习笔记（深入）”；
.parent {
position: relative;
}
.child {
position: absolute;
top: 0;
right: 0;
}
child 元素会相对于 parent 元素的右上角定位。
4. fixed 定位（固定定位）
元素脱离文档流，相对于浏览器视口进行定位，即使页面滚动，元素位置也不会改变。
YDUI Touch专为移动端打造，在技术实现、交互设计上兼容主流移动设备，保证代码轻、性能高；使用 Flexbox 技术，灵活自如地对齐、收缩、扩展元素，轻松搞定移动页面布局；用 rem 实现强大的屏幕适配布局，等比例适配所有屏幕；自定义Javascript组件、Less文件、Less变量，定制一份属于自己的YDUI。
常用于导航栏或回到顶部按钮。
示例：
立即学习“前端免费学习笔记（深入）”；
.navbar {
position: fixed;
top: 0;
left: 0;
width: 100%;
}
这个导航栏会始终固定在页面顶部。
5. sticky 定位（粘性定位）
行为介于 relative 和 fixed 之间。元素在滚动到特定阈值前表现为相对定位，到达阈值后变为固定定位。
必须指定 top、bottom、left 或 right 才能生效。
示例：
立即学习“前端免费学习笔记（深入）”；
.sticky-header {
position: sticky;
top: 0;
}
当用户滚动页面，该元素滚动到顶部时，会“粘”在视口顶部。
基本上就这些。掌握每种定位方式的特点和使用场景，就能灵活控制页面布局。
