Html 如何为子元素设置相同的顶部位置

我有下面的代码。我不知道为什么div1在2区的顶部位置不一样。如果child1中的div1包含文本或其他元素，则div1和div2、div3的顶部位置相等。请告诉我原因。非常感谢你

页面标题
* {
边际：0px；
填充：0px；
}
正文
正文
正文

浏览器处理没有内容或类似文本的图像的div因此它们与基线对齐，但如果div有内容，则内容本身与基线对齐，容器会自动调整

要解决这个问题，您可以在容器上创建一个类

子类
，并使用
垂直对齐：底部在其第一个div上

.child>div:first-of-type {
   vertical-align: bottom;
}

见下文；

页面标题
* {
边际：0px；
填充：0px；
}
.child>div:类型的第一个{
垂直对齐：底部对齐；
}
正文
正文
正文
避免对多个元素使用相同的id，因为第一个非法（不唯一）
id=“div1”
为空元素名称不唯一不是很重要的问题。但我会在代码中注意到。非常感谢。ID必须是独一无二的@Msterjojo更改divs id“不会解决OP的问题，因为无论如何都没有任何css声明。尽管如此，我还是更新了标记。谢谢@JerdineSabio。它工作正常。@NguyenVanTam不客气，如果它解决了您的问题，您可以将其标记为正确答案。