Question

如何在不更新其他对象流的情况下放置对象，但是指定相对于父对象的坐标？

澄清，

position: relative; top: -30px; left: 600px;更新以下对象的流量， position: absolute; top: -30px; left: 600px;不会更新流量，而是相对定位。

我不需要更新流程，而是指定相对定位。我也可以使用Javascript解决方案。

修改

我认为更好的例子是：我有一份文件，我现在要放一个＆lt; p＆gt;它在现有文档上显示而不改变流程（想想水印）。我还有一些特定的＆lt; div class ='abc'＆gt;，据我所知，我想放置新的＆lt; p＆gt;坐标坐标（600，-30）。

Answer 1

将position: relative;应用于父元素，并在子元素上使用position: absolute; top: whatever; left: whatever。您还可以使用z-index: something使父元素的原始内容与具有绝对定位的子元素重叠。

不确定我是否完全理解你的意思，但是......我认为这应该是http://www.doctype.com/，因为它不是真正的编程。

Answer 2

我认为我所寻找的是width:0;height:0;，因此由于这个元素，后面的流程没有重新排列。然而，我最初并不确定，如果我将它设置为0维，那么该对象将完全显示。

Answer 3

也许我没有正确理解你的问题，但流程也取决于父母的定位类型（绝对/相对）。请注意，这也可以从其父级等继承。

Answer 4

<style type="text/css">
<!--
.abc{background-color:#CFC;width:400px;position:relative;margin-left:80px;min-height:190px;padding:10px;}
.abc p.watermark{padding:20px;width:100px; position:absolute; top:60px;left:-30px;background-color:#FCF;}
.def{background-color:#9CF;width:300px;margin-top:12px;}
.def p{padding:20px;}
-->
</style></head>

<body>
<div class="abc">
  <p class="watermark">this reacts only to the div it is in</p>
  <p>more text in this div</p>
  <p>that will be overlapped by the paragraph with the class of &quot;watermark.&quot; can't style all &lt;p&gt; in the dive. or each block would overlap each other, and only the top one could be read.</p>
</div>
<div class="def">
   <p class="hi">this one is not affected by the paragraph above</p>
</div>

基本上，div得到相对定位，p得到绝对值（相对于它的相对容器，div）。确保p是它自己的类，而不是div的孩子。

CSS：相对定位而不更新流程

4 个答案: