我可以定位相对于父元素固定的元素吗？

小编典典

我可以定位相对于父元素固定的元素吗？

all

我发现当我将元素定位固定时，无论父元素是否相对定位，它都会相对于窗口定位固定？

#wrapper {
  width: 300px;
  background: orange;
  margin: 0 auto;
  position: relative;
}

#feedback {
  position: fixed;
  right: 0;
  top: 120px;
}


<div id="wrapper">
    ...
    <a id="feedback" href="#">Feedback</a>
</div>

http://jsbin.com/ibesa3

阅读 67

2022-04-08

共1个答案

小编典典

让我为这两个可能的问题提供答案。请注意，您现有的标题（和原始帖子）提出的问题不同于您在编辑和后续评论中寻求的问题。

要相对于父元素定位元素“固定” ，您需要position:absolute在子元素上以及父元素上的默认或静态以外的任何位置模式。

例如：

#parentDiv { position:relative; }
#childDiv { position:absolute; left:50px; top:20px; }

这会将childDiv元素定位在相对于 parentDiv 的位置向左 50 像素和向下 20 像素的位置。

要相对于 window 定位元素“固定”
，您需要position:fixed并且可以使用top:、left:、right:和bottom:来定位您认为合适的位置。

例如：

#yourDiv { position:fixed; bottom:40px; right:40px; }

这将yourDiv相对于 Web 浏览器窗口固定位置，距底部边缘 40 像素，距右边缘 40 像素。

2022-04-08