如何在div内垂直居中子元素？

在

内垂直居中元素元素

在网页中对齐元素时，了解相对于窗口对齐元素或相对于其父容器对齐元素之间的区别至关重要。使用左时：50%；将元素置于整个窗口的中心，将元素与其直接父元素

对齐。需要不同的方法。

要在

内实现垂直居中，请按照以下步骤操作：

1. 添加 text-align:center;到父级
   。这样可以确保其所有子元素水平居中。
2. 要使子元素垂直居中，请应用 margin:auto;。这会指示浏览器自动调整元素的顶部和底部边距，以均匀分配剩余空间。

演示这一点的示例 HTML 和 CSS 代码：

<div>
<pre class="brush:php;toolbar:false">#parent {
  text-align: center;
}

#child {
  margin: auto;
}

在此示例中，子元素在父元素

内水平和垂直居中。