position:fixed 相对父元素定位

 

position:fixed是对于浏览器窗口定位的，要实现相当于父元素定位，可以这样：不设置fixed元素的top，bottom，left，right，只设置margin来实现。

这种方法本质上fixed元素还是相当于窗口定位的，但是实现效果上是相对于父元素定位。

此外，position:fixed元素会受到父元素的影响，而出现不能以窗口进行定位：

1. 因为fixed元素并不总是相对于视窗进行定位的，父元素发生变换，也就是transfrom属性发生改变，如平移或旋转，会对固定定位的子元素产生影响 例子：固定定位不固定。https://codepen.io/huangbuyi/pen/mRYXbg

2. 如果父级元素的z-index的层次比同级元素低，就算fixed的z-index比父级高，也会被父级同级元素遮挡。（fixed元素的z-index会收到父元素影响）

因此，position:fixed元素若要以窗口进行定位，最好是放在body根标签下