如何在div中定位内容？

Question

我尝试制作博客文章预览，并希望文章的标题有0px到div的顶部

#Parent {
width: 500px;
height: 500px;
background-color: grey;
}
#Child {
color: white;
position: ?;
top ?;
padding ?;
}

Answer 1

要将子div放在父div中，您需要先将父div的位置设置为position：relative。然后将子div设置为position：absolute（然后可以使用top / left / right / bottom根据父级放置子div）。规则基本上是当你在一个元素上使用position：absolute时，它将从页面流中取出，并且绝对会被放置在＆＃39;根据最接近的元素。

#Parent {
 width: 500px;
 height: 500px;
 background-color: grey;
 position: relative; /* new code here */
}
#Child {
 color: white;
 position: absolute;
 top: 0;
 padding: 10px;
}