在web開發中，CSS居中是一項非常重要的技能，無論是水平居中、垂直居中還是居中對齊都是很常見的需求。接下來我們將介紹一些最全的居中方法。

// 水平居中
// 1. margin: 0 auto
.container {
width: 500px; // 需要有寬度
margin: 0 auto;
}
// 2. transform
.container {
width: 500px; // 需要有寬度
position: relative;
}
.container div {
position: absolute;
left: 50%;
transform: translateX(-50%);
}
// 3. flexbox
.container {
display: flex;
justify-content: center;
align-items: center;
}

// 垂直居中
// 1. table-cell
.container {
display: table-cell;
vertical-align: middle;
}
// 2. flexbox
.container {
display: flex;
justify-content: center;
align-items: center;
height: 100vh; // 確定高度
}
// 3. grid
.container {
display: grid;
place-items: center;
height: 100vh; // 確定高度
}

// 居中對齊
// 1. text-align
.container {
text-align: center;
}
.container p {
display: inline-block; // 需要有寬度
}
// 2. line-height
.container {
height: 200px; // 需要有高度
line-height: 200px;
text-align: center;
}
// 3. flexbox
.container {
display: flex;
justify-content: center;
align-items: center;
}
.container div {
width: 100px; // 需要有寬度
height: 100px; // 需要有高度
margin-right: 20px; // 需要有間距
}

以上就是最全的CSS居中方法，希望對你有所幫助。