在CSS中，我們可以使用多種方法將兩個圖片橫排，以下是一種簡單的方法：
1、使用Flexbox：
Flexbox是一個強(qiáng)大的CSS布局工具，它可以讓你的網(wǎng)頁元素（包括圖片）輕松地進(jìn)行橫排布局。
```css
.image-container {
display: flex;
justify-content: space-between; /* 圖片之間保持一定距離 */
}
```
```html
<div class="image-container">
<img src="image1.jpg" alt="圖片1" />
<img src="image2.jpg" alt="圖片2" />
</div>
```
2、使用Grid布局：
Grid布局也是CSS中的一個強(qiáng)大工具，它可以將圖片和其他元素***地放置在網(wǎng)格中。
```css
.image-grid {
display: grid;
grid-template-columns: 1fr 1fr; /* 創(chuàng)建兩個等寬的列 */
gap: 10px; /* 圖片之間保持10像素距離 */
}
```
```html
<div class="image-grid">
<img src="image1.jpg" alt="圖片1" />
<img src="image2.jpg" alt="圖片2" />
</div>
```
3、使用float屬性：
雖然float屬性在現(xiàn)代布局中較少使用，但它仍然是一個簡單的方法來實(shí)現(xiàn)圖片橫排。
```css
.image-float {
float: left; /* 圖片浮動到左側(cè) */
margin-right: 10px; /* 圖片右側(cè)保持一定距離 */
}
```
```html
<div>
<img class="image-float" src="image1.jpg" alt="圖片1" />
<img class="image-float" src="image2.jpg" alt="圖片2" />
</div>
```
4、使用CSS的并列布局：
通過簡單的CSS樣式，我們可以將兩個圖片并列顯示。
```css
.image-side-by-side {
display: inline-block; /* 圖片之間并列顯示 */
margin-right: 10px; /* 圖片之間保持一定距離 */
}
```
```html
<div>
<img class="image-side-by-side" src="image1.jpg" alt="圖片1" />
<img class="image-side-by-side" src="image2.jpg" alt="圖片2" />
</div>
```
這些方法可以幫助你在CSS中實(shí)現(xiàn)圖片的橫排布局，你可以根據(jù)自己的需求和喜好選擇***適合的方法，如果你需要更復(fù)雜的布局或?qū)R需求，可能需要結(jié)合使用這些方法或者尋找更專業(yè)的CSS布局解決方案。
