CSS中設置布局居中顯示是Web頁面設計中常用的方法。以下是幾種常用的方式：

/* 水平居中 */
.element {
margin: 0 auto;
text-align: center;
}
/* 垂直居中 */
.parent {
display: flex;
justify-content: center;
align-items: center;
}
/* 水平垂直居中 */
.parent {
position: relative;
}
.child {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}

第一種方式是將元素的左右margin設置為auto，同時將文本對齊方式設置為居中。這種方式適用于元素的寬度已知且為固定值。

第二種方式是使用Flexbox布局，將父元素設置為Flex容器，通過設置justify-content和align-items屬性使子元素水平和垂直居中。這種方式適用于父元素和子元素的寬高不定或寬高比例不定的情況。

第三種方式是通過設置子元素的絕對位置和translate屬性，使其相對于父元素水平垂直居中。這種方式也適用于父元素和子元素的寬高不定或寬高比例不定的情況。