[分享]css中怎么样div居中显示

CSS中如何将div居中显示是一个常见的问题。在这篇文章中，我们会介绍几种实现方法。

方法一：使用margin

#div1 {
  width: 200px;
  height: 100px;
  margin: auto;
} 

这种方法是使用了margin: auto;将div水平居中显示。需要注意的是，此方法只对定宽的元素有效。

方法二：使用flex

#div2 {
  display: flex;
  justify-content: center;
  align-items: center;
} 

这种方法是使用了flex布局将div水平垂直居中显示。这种方法不需要知道div的宽高。

方法三：使用position

#div3 {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
} 

这种方法是使用了position + transform将div水平垂直居中显示。此方法适用于需要div在一个容器中居中的情况。

通过以上方法，我们可以轻松的将div居中显示出来。你可以根据具体情况选择适合自己的方法。