CSS 绝对定位属性解析：absolute 和 fixed

在CSS中，position: absolute;和position: fixed;是两种不同的定位机制，以下是对这两种定位属性的详细解析：

absolute 定位

absolute定位使元素脱离文档流，并相对于其最近的非 static 定位祖先元素进行定位，如果没有这样的元素，则相对于初始包含块，使用top、right、bottom、left等属性可以指定元素的确切位置。

特点

元素脱离正常文档流，不占据空间。

相对于最近的非 static 定位的祖先元素定位，如果没有，则相对于初始包含块（通常是视口）。

定位元素的位置可以通过top、right、bottom、left属性来设置。

重叠其他元素时，会覆盖在上方，因为它已经脱离了文档流。

fixed 定位

fixed定位也使元素脱离文档流，但与absolute不同的是，它是相对于浏览器窗口进行定位的，无论页面如何滚动，fixed定位的元素都会停留在设定的位置。

特点

元素脱离正常文档流，不占据空间。

相对于浏览器窗口定位，即使页面滚动，元素也会停留在相同的位置。

同样可以使用top、right、bottom、left等属性来定位元素。

固定定位通常用于创建始终可见的导航栏或广告横幅等。

比较

在实际开发中，使用absolute和fixed定位可以实现多种布局效果，但需要注意它们对页面布局的影响，以及可能引起的层叠顺序问题，通过合理地设置zindex属性，可以控制不同定位元素的堆叠顺序。