在Web頁面設計中，經常需要用到橫排的圖片。那么該如何用CSS來實現呢？下面我們來介紹一下具體的方法。

.thumbnail{
display: inline-block; /*將元素設置為塊級元素，并使其在同一行內排列*/
width: 200px; /*設置圖片的寬度*/
height: 200px; /*設置圖片的高度*/
margin-right: 20px; /*設置右邊距*/
vertical-align: top; /*將圖片向上對齊*/
}

以上代碼中，我們首先為元素設置了display:inline-block屬性，將其設置為塊級元素，使其在同一行內排列。然后，我們分別設置了圖片的寬度、高度和右邊距，以便對圖片進行排列。同時，我們還需要使用vertical-align屬性，將圖片向上對齊。

接下來，我們需要在HTML文件中將圖片進行排列。這里我們以展示三張圖片為例：

<div class="pictures">
<img src="picture1.jpg" class="thumbnail">
<img src="picture2.jpg" class="thumbnail">
<img src="picture3.jpg" class="thumbnail">
</div>

以上代碼中，我們首先在一個名為pictures的div元素中展示了三張圖片，并為這些圖片使用了剛剛定義的.thumbnail類。

通過使用CSS中的display:inline-block、width、height、margin-right和vertical-align屬性，我們就可以輕松地在Web頁面中顯示橫排的圖片了。