在進行網頁排版的時候，樣式是很重要的一部分，因為它可以決定你的網頁的美觀度。其中，背景小圖標和文字的垂直對齊就是常見的排版問題。下面，我們來解決這個問題。
首先，我們可以使用CSS的background屬性來添加小圖標。具體來說，可以將小圖標使用背景圖片的方式添加到元素中，例如：

p {
background: url(image.png) no-repeat left center;
padding-left: 20px;
}

上面代碼中的left center表示把背景圖片放在元素的左邊水平居中的位置。padding-left則是為了讓文字內容與背景圖片之間有一定的距離。
但是這會導致一個問題，就是文字的垂直對齊問題。解決方法是使用 CSS 的 line-height 屬性。將元素的 line-height 屬性的值設置為元素的高度，就可以讓文字在垂直方向與背景圖片對齊了。例如：

p {
background: url(image.png) no-repeat left center;
padding-left: 20px;
line-height: 30px;
height: 30px;
}

上述代碼中，line-height 和 height 的值都為 30px，這樣文本內容就會垂直居中，與背景圖片對齊。
除了使用 line-height，還可以使用 vertical-align 屬性。當 vertical-align 屬性應用于表格單元格或內聯元素時，可以使元素的內容與周圍元素垂直對齊。例如：

p {
background: url(image.png) no-repeat left center;
padding-left: 20px;
vertical-align: middle;
display: inline-block;
height: 30px;
}

上述代碼中，使用了 display: inline-block 把 p 元素變成了一個內聯塊元素，同時將 vertical-align: middle 應用于內聯塊元素，實現了文字垂直居中。而 height 屬性則定義了元素的高度。
綜上所述，我們可以使用背景小圖標和文字的垂直對齊的方法，分別是使用 line-height 和 vertical-align 屬性。不同的應用場景可以選用不同的方法。