在網(wǎng)頁設(shè)計中，要讓頁面居中看起來更美觀、簡潔，同時也能夠提高用戶體驗。下面介紹css中設(shè)置頁面居中的方法。

1. 使用margin屬性

/* 將margin值設(shè)置為auto */
.container {
width: 960px;
margin: auto;
}

這種方式主要是通過將margin值設(shè)置為auto來使容器居中。

2. 使用flexbox布局

/* 父容器設(shè)置display: flex; 子容器設(shè)置margin: auto; */
.container {
display: flex;
justify-content: center; /* 橫向居中 */
align-items: center; /* 縱向居中 */
}
.container div {
margin: auto;
}

使用flexbox布局，只需要在父容器中將display屬性設(shè)置為flex，然后使用justify-content和align-items屬性即可實現(xiàn)居中效果。

3. 使用position屬性

/* 父容器設(shè)置position: relative; 子容器設(shè)置position: absolute; */
.container {
position: relative;
}
.container div {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}

這種方法是通過父容器設(shè)置position屬性為relative，再通過子容器使用position屬性為absolute，并且通過top、left、transform屬性來實現(xiàn)居中效果。

以上就是css中設(shè)置頁面居中的三種常用方式，根據(jù)不同的實際需求，選擇不同的方法來實現(xiàn)頁面居中。