CSS3是最新版的CSS，支持許多新的特性，其中就包括居中布局。如何使用CSS3居中布局呢？下面我們來介紹幾種方法。

方法一：水平居中

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

上面代碼中，我們將父元素的display屬性設置為flex，然后使用justify-content屬性將子元素水平居中。這種方法兼容性較好，支持IE10及以上版本。

方法二：水平垂直居中

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

這種方法需要先將父元素的position屬性設置為relative，然后再將子元素的position屬性設置為absolute。接著使用top和left屬性將子元素定位在父元素的中心。最后使用transform屬性對子元素進行微調，實現水平垂直居中。這種方法兼容性較好，支持IE9及以上版本。

方法三：水平垂直居中（flex布局）

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

這種方法同樣使用了flex布局，通過align-items和justify-content屬性均為center來實現水平垂直居中。這種方法兼容性較好，支持IE10及以上版本。

除了上述三種方法外，還有其他一些方法可以實現居中布局，但兼容性不太好，需要根據實際情況選擇使用。總之，在實際開發過程中，居中布局是常見的需求，了解多種實現方法可以在某些場景下更加便利。