CSS 字體 ul 垂直居中是很常見的需求，因為一次性展示多個選項時需要加入項目符號滑動菜單，在實踐中，我們可以使用下面的方法實現文字和圖標的垂直對齊： 首先，我們需要將 ul 的 display 設置為 flex，并使用 align-items: center 屬性垂直對齊文本和圖標。然后，我們可以將 li 元素設置為 display: flex，并在內部放置 i 標簽來表示項目符號圖標。 下面的代碼展示了具體的實現：

ul {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
list-style: none;
padding: 0;
margin: 0;
}
li {
display: flex;
justify-content: center;
align-items: center;
margin-bottom: 10px;
}
li i {
margin-right: 5px;
}

在這個示例中，我們將 ul 的方向設置為列方向，這意味著每個 li 將顯示為一個單獨的行。我們還將列表的樣式設置為無樣式，這將隱藏默認的項目符號，并使用 i 標簽來代替項目符號。 這種方法可以輕松地垂直對齊文本和圖標，使您的網站看起來更現代和專業。如果您需要在您的網站上實現滑動菜單，這種方法非常有用。