CSS中，我們可以使用多種方法來(lái)讓子元素水平排列，以下是一些常見(jiàn)的方法：

1、使用flex布局

Flex布局是一種非常強(qiáng)大的CSS布局方式，可以輕松地讓子元素水平排列，我們只需要將父元素的display屬性設(shè)置為flex，然后讓子元素在水平方向上排列即可。

.parent {
  display: flex;
  justify-content: space-between; /* 可選，用于調(diào)整子元素之間的間距 */
}
.child {
  /* 子元素的樣式 */
}

2、使用grid布局

Grid布局是另一種強(qiáng)大的CSS布局方式，它可以讓子元素在水平和垂直方向上同時(shí)排列，我們只需要將父元素的display屬性設(shè)置為grid，然后定義行和列的樣式即可。

.parent {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr; /* 定義列樣式，這里將父元素分成了三列 */
  grid-template-rows: 1fr; /* 定義行樣式，這里將父元素分成了一行 */
}
.child {
  /* 子元素的樣式 */
}

3、使用float屬性

在CSS中，我們可以使用float屬性來(lái)讓子元素浮動(dòng)到父元素的左側(cè)或右側(cè)，通過(guò)調(diào)整float屬性的值，我們可以輕松地讓子元素水平排列。

.child {
  float: left; /* 將子元素浮動(dòng)到左側(cè) */
}

或者：

.child {
  float: right; /* 將子元素浮動(dòng)到右側(cè) */
}

需要注意的是，使用float屬性時(shí)，我們需要清除浮動(dòng)，以避免影響其他元素的布局，可以通過(guò)添加清除浮動(dòng)的樣式來(lái)實(shí)現(xiàn)：

.clear {
  clear: both; /* 清除左右兩側(cè)的浮動(dòng) */
}

并在需要的地方添加該樣式：

<div class="clear"></div>