CSS 如何實現字體居中？

讓字體居中對于排版來說是非常重要的。CSS 有不同的方法可以實現字體居中。

1. 使用 line-height

可以使用 line-height 實現行內文本垂直居中，將 line-height 設置為盒子的高度，就可以讓文本在垂直方向居中。例如：

示例代碼：
.container{
height: 100px;
line-height: 100px;
text-align: center;
}
.container p{
display: inline-block;
vertical-align: middle;
}

2. 使用 display 和 vertical-align

可以使用 display 和 vertical-align 實現行內塊元素垂直居中。將文本包裹在一個帶有 display: inline-block 的容器中，并將 vertical-align 設置為 middle 即可使文本在垂直方向居中。例如：

示例代碼：
.container{
height: 100px;
text-align: center;
}
.container p{
display: inline-block;
vertical-align: middle;
}

3. 使用 flexbox

可以使用 flexbox 來實現垂直和水平文本居中。設置容器的 display 為 flex，再使用 align-items: center 和 justify-content: center 即可實現文本居中。例如：

示例代碼：
.container{
height: 100px;
display: flex;
align-items: center;
justify-content: center;
}
.container p{
margin: 0;
}

總結：

以上三種方法都可以實現文本的居中。在選擇使用哪種方法時，需要考慮文本的結構和場景。選用適合場景的方法可以提高代碼的可讀性和性能。