HTML 文本垂直對齊是網頁設計中必不可少的一項技能。當我們需要讓不同的 HTML 元素以不同的方式對齊時，就需要使用垂直對齊。

<div style="display:table;">
<div style="display:table-cell; vertical-align:middle;">
<h1>這是標題</h1>
</div>
<div style="display:table-cell; vertical-align:middle;">
<p>這是描述文字</p>
</div>
</div>

在上面的代碼中，我們使用了一個 div 容器，并在其中添加了兩個 div 子元素。這兩個子元素都設置了display:table-cell;屬性，而且都設置了垂直對齊的屬性vertical-align:middle;。這樣就可以實現兩個元素的垂直對齊了。

另外，如果我們需要垂直對齊的元素包含文本和圖片等多個子元素，可以給子元素添加display:inline-block;屬性，并設置vertical-align:middle;屬性，即可實現多元素垂直對齊。

<div style="display:flex; align-items:center;">
<img src="image.jpg" style="vertical-align:middle;">
<p style="display:inline-block; margin-left:10px; vertical-align:middle;">這是描述文字</p>
</div>

在上面的代碼中，我們使用一個 div 容器，并將其設置為display:flex;，并且使用align-items:center;屬性來實現子元素的垂直對齊。同時，我們給描述文字元素添加了display:inline-block;屬性，并且在樣式中設置了margin-left:10px;屬性，來實現描述文字在圖片右側且與圖片對齊。