在網頁布局中，如何讓元素居中是一個常見的問題。使用 CSS 樣式可以很方便地實現網頁的居中布局。下面介紹一些常用的方法：

水平居中

讓一個塊級元素水平居中通常有以下兩種方法：

/* 方法一：使用 margin 屬性 */
div {
width: 200px;
margin: 0 auto;
}
/* 方法二：使用 text-align 屬性 */
div {
width: 200px;
text-align: center;
}
div p {
display: inline-block; /* 讓 p 元素以塊級元素的形式展示 */
text-align: left; /* 為了避免文字也居中，需要將 p 元素中的文字左對齊 */
}

垂直居中

讓一個塊級元素垂直居中通常有以下兩種方法：

/* 方法一：使用絕對定位 */
div {
position: relative; /* 父元素一定要設置為 relative */
height: 200px;
}
div p {
position: absolute;
top: 50%; /* 讓元素的上邊緣位于父元素的中央位置 */
transform: translateY(-50%); /* 讓元素自身向上移動一半的高度即可完成垂直居中 */
}
/* 方法二：使用 flex 布局 */
div {
display: flex;
align-items: center; /* 讓子元素在垂直方向上居中 */
}

以上是常用的幾種實現網頁居中布局的方式。希望對大家有所幫助！