CSS是一種很強大的樣式表語言，可以用來控制網頁的布局和樣式。其中，頁面布局居中顯示是很常見的問題，下面介紹幾種實現方法。

/* 水平居中：已知寬度 */
.container {
width: 800px;
margin: 0 auto;
}
/* 水平居中：未知寬度，inline元素 */
.container {
text-align: center;
}
.elem {
display: inline-block;
}
/* 水平居中：未知寬度，block元素 */
.container {
text-align: center;
}
.elem {
display: inline-block;
text-align: left;
}
/* 垂直居中：已知高度，采用絕對定位 */
.container {
position: relative;
height: 400px;
}
.elem {
position: absolute;
top: 50%;
margin-top: -20px; /* 高度的一半 */
}
/* 垂直居中：已知高度，采用flex布局 */
.container {
display: flex;
justify-content: center;
align-items: center;
height: 400px;
}
.elem {
/* 空 */
}
/* 垂直居中：未知高度，采用flex布局 */
.container {
display: flex;
justify-content: center;
align-items: center;
min-height: 400px;
}
.elem {
/* 空 */
}

以上就是一些常用的CSS頁面布局居中顯示的方法，具體使用時可以根據實際情況進行選擇。希望對大家有所幫助。