CSS 中設(shè)置居中顯示經(jīng)常在頁面布局中使用，可以讓元素在頁面中垂直或水平方向上居中顯示。下面就來介紹一下如何使用 CSS 設(shè)置居中顯示。

在 CSS 中設(shè)置居中顯示主要有兩種方式，分別是使用margin和text-align屬性。

居中垂直顯示：
.parent {
display: flex;
justify-content: center;
align-items: center;
}
居中水平顯示：
.parent {
text-align: center;
}
子元素為行內(nèi)元素：
.child {
display: inline-block;
}
子元素為塊級元素：
.child {
display: block;
margin: 0 auto;
}

其中，margin屬性可以用來設(shè)置子元素在父元素中的位置，當(dāng)需要垂直和水平居中時，可以使用justify-content: center; align-items: center;讓父元素 flex 布局并將子元素居中。

而當(dāng)只需要水平居中時，可以使用text-align: center;。同時需要注意，子元素為行內(nèi)元素時，可以直接使用這種方式，但是如果子元素為塊級元素，需要將其設(shè)置為display: block;并加上margin: 0 auto;。