在前端開發中，很常見的需求就是要把盒子居中。那么怎么能輕松地實現這一目標呢？下面我們來介紹一些CSS 居中布局的技巧。

/* 水平居中方法1：text-align */
.container {
text-align: center;
}
/* 水平居中方法2：margin */
.container {
margin: 0 auto;
}
/* 垂直居中方法1：display+table */
.container {
display: table;
}
.container-child {
display: table-cell;
vertical-align: middle;
}
/* 垂直居中方法2：position+transform */
.container {
position: relative;
}
.container-child {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
/* 水平垂直居中 */
.container {
display: flex;
justify-content: center;
align-items: center;
}

以上就是幾種常用的CSS 居中布局方法。具體使用哪種方法，可以根據實際需求靈活選擇。