1. static（静态定位）:
position: static; 是元素的默认定位方式，元素在文档流中正常排列，不受 top, right, bottom, left 属性影响。
div {
position: static;
}
2. relative（相对定位）:
position: relative; 相对于元素在文档流中的原始位置进行定位，可以通过 top, right, bottom, left 属性进行微调。
div {
position: relative;
top: 10px;
left: 20px;
}
3. absolute（绝对定位）:
position: absolute; 相对于最近的已定位祖先元素（非 static）进行定位，如果没有已定位祖先元素，则相对于文档的 <html> 元素进行定位。
div {
position: absolute;
top: 30px;
right: 10px;
}
4. fixed（固定定位）:
position: fixed; 相对于视口进行定位，元素在页面滚动时仍然保持在相同位置。
div {
position: fixed;
bottom: 0;
right: 0;
}
5. sticky（粘性定位）:
position: sticky; 是相对定位和固定定位的混合，元素在滚动到某个阈值位置时变为固定定位，否则保持相对定位。
div {
position: sticky;
top: 10px;
}
6. inherit（继承父元素定位）:
position: inherit; 表示元素继承父元素的 position 属性。
div {
position: inherit;
}
7. initial（初始值）:
position: initial; 将 position 属性重置为其初始值，即 static。
div {
position: initial;
}
这些 position 属性值是用于控制元素在页面中的位置的关键工具。根据具体的设计需求，你可以选择合适的 position 属性值来实现所需的页面布局和效果。
转载请注明出处：http://www.zyzy.cn/article/detail/12535/CSS