Html 如何使一个元素位于某个div的上方但在其子元素的下方？

是否可以使类为1的div位于父div之上但位于子div之下

是的，这是可能的

HTML

好的，那么：

HTML

---

查看它。

这种方式甚至更短：

.one {
    margin-top: 100px;
    background: blue;
    height: 200px;
    width: 100px;
}

.parent {
    background: yellow;
    height: 100px;
    width: 100px;
    position: relative;

}
.child {
    position: absolute;
    background: green;
    height: 100px;
    width: 100px;
    top: -300px;
}

---

请参见此处的示例：

是的，这是css修改。查看位置标签绝对你的JSFIDLE链接到JSFIDLE主页。这不是我想要的。如果你给一个类为1的div一个100px的顶点，它就结束了。我希望它低于孩子，但高于父母。

<div class="one"> 1 </div>

<div class="parent">
    parent
    <br/>    <br/>    <br/>    <br/>
  <div class="child">
      child
  </div>
</div>

.one{
    background:yellow;
    height:30px;
    width:100px;
    position:absolute;
    top:50px;
}

.parent{
       background:green;
    height:300px;
    width:100px;
}

.child{
     background:black;
    height:100px;
    width:60px;
}

<div class="one">One
</div>

<div class="parent">Parent
  <div class="child">Child
  </div>
</div>

.one {
    margin-top: 100px;
    background: blue;
    height: 200px;
    width: 100px;
}

.parent {
    background: yellow;
    height: 100px;
    width: 100px;
    position: relative;

}
.child {
    position: absolute;
    background: green;
    height: 100px;
    width: 100px;
    top: -300px;
}

.one { margin-top: 100px; }
.child { width: 100%; height: 100px; position: absolute; top: 0; }