CSS 可以幫助我們讓字體和圖片垂直排列。在這篇文章中，我們將介紹三種常見的方法來實現(xiàn)這個目標(biāo)。

方法一：使用 line-height 屬性

img {
vertical-align: middle;
}
p {
font-size: 18px;
line-height: 32px;
}

在這個例子中，我們使用了 line-height 屬性來讓文本和圖片垂直對齊。我們還將圖片的 vertical-align 屬性設(shè)置為 middle，以確保其位于行的中間。

方法二：使用 display:flex

.container {
display: flex;
align-items: center;
}
p {
font-size: 18px;
}

我們可以使用 display:flex 來創(chuàng)建一個容器，容器的 align-items 屬性可以將內(nèi)容垂直居中。這個方法需要在容器上設(shè)置，而不是在單個元素上。

方法三：使用 table 和 table-cell 屬性

.container {
display: table;
}
p {
display: table-cell;
vertical-align: middle;
font-size: 18px;
}

最后一種方法是使用 table 和 table-cell 屬性。我們可以將容器的 display 屬性設(shè)置為 table，然后將文本元素的 display 屬性設(shè)置為 table-cell，再將 vertical-align 屬性設(shè)置為 middle。這樣可以使文本垂直對齊到圖像。