CSS是前端開發必不可少的技能之一，而其中一個基本的應用就是使圖片橫向排列。本文將介紹如何利用CSS實現圖片橫向排列。

首先，在HTML中添加需要橫向排列的圖片，并為它們添加一個共同的class，以便在CSS中進行樣式控制。下面是一個例子：

<div class="img-container">
<img class="img-item" src="img1.jpg" alt="image 1">
<img class="img-item" src="img2.jpg" alt="image 2">
<img class="img-item" src="img3.jpg" alt="image 3">
</div>

上面的代碼添加了三張圖片，并將它們包裹在一個div容器中，并為每張圖片添加了img-item的class。

接下來，在CSS中添加以下樣式：

.img-container {
display: flex; /* 將容器設置為彈性布局 */
}
.img-item {
margin: 0 10px; /* 圖片之間的間隔 */
}

上面的代碼將容器設置為彈性布局，這使得它們能夠自動排列在一行中，而不需要手動調整其位置。同時，為img-item添加了一個margin來給圖片之間設置一定的間隔。

最終的效果如下所示：

在實際開發中，我們還可以利用響應式設計來使圖片在不同的屏幕尺寸下具有不同的排列布局。這需要對CSS的彈性布局進行深入研究和學習。希望本文能夠為你提供一些CSS排列圖片的基礎知識。