定位方式

五种基本定位方式

.static { 
  position: static; /* 默认，正常文档流，不受 top/left 等属性影响 */
}
.relative { 
  position: relative; /* 相对自身原位置偏移，不脱离文档流 */
  top: 10px; left: 20px; /* 偏移 */
}
.absolute { 
  position: absolute; /* 相对于最近非 static 定位的父元素，脱离文档流 */
  top: 0; left: 0;
}
.fixed { 
  position: fixed; /* 相对于视口定位，脱离文档流 */
  top: 0; right: 0;
}
.sticky { 
  position: sticky; /* 滚动时粘性定位（滚动到阈值时在 relative 和 fixed 之间切换） */
  top: 0;
}