是否可以在同一个html页面中多次使用“相对位置”？

Question

我在母版页上使用'position relative'和'position absolute'。

我有一个页面使用上述母版页， 我试图在此页面中使用'位置相对'和'位置绝对'两个其他元素，但下面的元素（'绝对位置' ）不是根据他的（'位置相对'）上的元素放置的，而是指主页中元素的'位置相对'。

希望不是太笨拙的解释。

是否可以在同一个HTML页面上多次使用'相对位置'？ 如果是这样，怎么样？

谢谢， Ef。

Answer 1

在添加相关代码/信息/演示之前，我无法回答为什么您的代码和布局有问题，但是我可以向您保证，您可以在一个页面上拥有多个相对定位的元素，事实上，您可以根据需要多次应用和定位样式。

element { 
    position:relative; 
     } 

element2 { 
    position:relative; 
     } 

你只是定义元素的规则而言，有对的时候，你可以使用任何规则的规则是相互独立的量没有规则。

参考

你或许应该以把握元素的定位是如何作用于this page阅读。

Answer 2

对于你的问题： 你不限于你想要相对或绝对定位多少元素。

但是，定位非常棘手。你的元素最容易错位的原因是你的CSS中的错误定义。

我会给它是如何工作的一个简短的解释：

所有元素都有标准定位static。

但是，您可以在您喜欢的元素上定义position:relative。 现在用top|left|right|bottom可以将元素相对于原​​始位置移动。 （原来的空间撑占领！）

position:absolute也可以在尽可能多的元素定义，只要你喜欢，但它的工作方式不同：

元素不占据其原始位置和相对放置第一没有静态定位的祖先元素。 （我觉得这是你提到的错误 - 你有position:relative但绝对定位的元素同级变得定位根据相对/静态位置父元素）

这些只是非常基本的，更多的洞察信息，read this article。