在页面上垂直和水平居中放置<div>的最佳方法？

• Z时代
• 2024-01-10
• 分类：问答

<div>在页面上垂直和水平居中放置元素的最佳方法？

我知道这margin-left: auto; margin-right: auto;将以水平为中心，但是垂直进行的最佳方法是什么？

回答：

该演示的主要技巧是元素的正常流动是从上到下，因此将margin-top: auto其设置为零。然而，绝对定位的元件作用为自由空间分布是相同的，并且类似地可以垂直在指定为中心top并且bottom（不IE7工作）。

此技巧适用于的任何大小div。

div {
    width: 100px;
    height: 100px;
    background-color: red;
    position: absolute;
    top:0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
}

<div></div>

以上是 在页面上垂直和水平居中放置<div>的最佳方法？ 的全部内容， 来源链接： utcz.com/qa/419316.html