css居中最简单的方法

CSS居中是HTML页面设计中非常重要的一个环节。但是，很多初学者在实现CSS居中时会遇到一些困难，导致页面布局出现错乱的情况。其实，CSS居中有很多方法，下面我们来介绍一下最简单的方法。

代码演示：
.center {
  display: flex;
  justify-content: center;
  align-items: center;
}

以上代码非常简单，只需要在需要居中的元素上加上一个class名称，然后将该class的属性设置为display:flex; justify-content:center; align-items:center;即可，这样就能实现元素在水平和垂直方向上的居中。

需要注意的是，以上方法适用于元素固定大小的情况下，如果元素大小不固定，可以将display:flex;改为display:inline-flex;

如果想要实现文字或图片的居中，也可以使用text-align:center;或者margin:auto;的方法。

代码演示：
.text-center {
  text-align:center;
}

.img-center {
  display:block;
  margin:auto;
}

以上代码就是实现文字和图片居中的最简单方法了。

综上所述，以上几种方法都是CSS居中最简单的方法，初学者可以先尝试一下，熟练掌握后再深入了解其他居中方法。