很多人在使用CSS進(jìn)行頁面布局時都會遇到一個共同的問題：如何讓元素居中顯示？其實，讓元素居中顯示并不難，下面就來介紹一些簡單的方法。

1. 水平居中

在要居中的元素的父元素中添加以下CSS代碼：

.parent {
text-align: center;
}
.center {
display: inline-block;
}

其中，.parent為要居中的元素的父元素，.center為要居中的元素。將要居中的元素設(shè)置為inline-block，然后在父元素中使用text-align:center將其水平居中。

2. 垂直居中

在要居中的元素的父元素中添加以下CSS代碼：

.parent {
display: flex;
justify-content: center;
align-items: center;
}

其中，.parent為要居中的元素的父元素。使用flex布局，將justify-content和align-items都設(shè)置為center即可讓要居中的元素垂直居中。

3. 水平垂直居中

在要居中的元素的父元素中添加以下CSS代碼：

.parent {
position: relative;
}
.center {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}

其中，.parent為要居中的元素的父元素，.center為要居中的元素。將要居中的元素設(shè)置為絕對定位，然后使用top:50%和left:50%將其移動到父元素的中心位置。最后使用transform: translate(-50%, -50%)將其向上向左移動自身寬度和高度的一半，即實現(xiàn)了水平垂直居中。

總結(jié)：讓元素居中顯示其實很簡單，只需要根據(jù)不同的情況選擇相應(yīng)的方法即可。希望這篇文章對大家有所幫助。