6

“绝对定位的元素是相对于最近定位的祖先定位的。” - MDN：位置 - CSS

当有一个父母被定义为position:relative;但我没有意识到在position:absolute技术上符合“定位的祖先”时，我理解了这一点。

这是一个示例： http: //jsfiddle.net/MSzZG/如果文本“在顶部”可以将top属性应用于窗口而不是包含，那就太好了，div但我只是不知道是否可以绕过.

<div>
 <div>Content
 </div>
</div>
<div style="position:absolute;">
 <div style="position:absolute;top:0px;">At top
 </div>
</div>

有没有办法绕过以前定位的绝对元素（不使用固定）？JavaScript 解决方案是可以接受的。

4

3 回答 3

3

您必须计算其自然位置与所需位置之间的差异，才能将其绝对放置在窗口中。

如果你使用 jQuery，你可以让它通过.offset(coordinates)函数为你计算。

于 2013-06-13T21:36:26.570 回答
2

回答

不，你不能那样做。

推理

如果您能够做到这一点，那么您可以将一个 div 完全远离父级。这不仅会使父母“孤独”，而且完全违背了嵌套的目的。嵌套 div 标签或任何标签不仅仅是为了美观；这样做是为了向用户传达文本含义。

我可以建议重新考虑您的方法吗？也许如果您解释您希望最终结果成为什么，我们可以为您提供帮助。肯定有解决办法。

可能的解决方案

  • 如果您需要将内部 div 定位在顶部，则将其拉出一层。
  • 从父级中删除绝对定位。
  • 使用绝对定位以外的另一种定位方法。
于 2013-06-13T20:58:57.733 回答
1

如果您希望内部position: absolutediv 相对于窗口（您应该指定position: relative）定位，则不需要嵌套它。

position: absolute将始终相对于其最直接定位的父级定位（使用position: absoluteor position: relative）。你无法绕过这一点——你只需要更好地构建 HTML 或以不同的方式实现 CSS。

所以基本上你的问题的答案是否定的 :( 至少在不使用你特别提到不想做的固定定位的情况下。

于 2013-06-13T20:53:41.043 回答