fixed定位元素始终相对于视口固定，不受父元素定位影响，但若父元素设置了transform属性，则会改变其包含块，导致fixed元素相对该父元素定位，需避免此类情况。
在CSS中，fixed定位的元素是相对于视口（viewport）进行定位的，而不是相对于其父元素。这意味着无论父元素是什么定位方式、是否滚动或有无边框，fixed元素都不会受它影响。
fixed定位脱离文档流
使用 position: fixed; 的元素会从正常的文档流中移除，它的定位基准是浏览器的可视窗口。即使页面滚动，该元素也会固定在设定的位置上不动。
- fixed元素不会随着页面滚动而移动
- 它不占据文档中的普通空间
- 其层级行为受z-index控制
与父元素定位无关
无论父元素是static、relative、absolute还是fixed，fixed元素都不会以父元素为参考点。这一点和absolute不同，absolute会找最近的已定位祖先元素作为参考，而fixed始终以视口为参考。
- 给父元素设置 position: relative 不会影响 fixed 子元素的位置基准
- 即使父元素有transform、perspective等属性，也可能改变fixed的“包含块”
特殊情况：被transform影响的包含块
如果一个父元素设置了 transform 属性（如 translate、rotate），那么这个父元素会成为 fixed 元素的“新的包含块”——也就是说，fixed元素会相对于这个被transform的父元素定位，而不是视口。
立即学习“前端免费学习笔记（深入）”；
- 这是个容易忽略的细节
- 例如：父元素设置了 transform: translateY(10px); 后，fixed子元素将不再相对于视口固定
- 解决方法：避免在可能包含fixed子元素的容器上使用transform
