怎么让4个div横向依次排列2个

您可以使用CSS中的Flexbox布局来实现这个效果。您可以使用以下CSS代码：

.container {
  display: flex;
  flex-wrap: wrap;
}

.container > div {
  flex: 1 0 50%;
}

这里的`.container`是包含4个`<div>`元素的父元素。`display: flex;`将其设置为Flex容器，`flex-wrap: wrap;`使得当子元素超出容器宽度时会自动换行。`flex: 1 0 50%;`则是指定子元素占据剩余空间的比例为1，不允许缩小，宽度为50%。这样就可以让4个`<div>`元素横向依次排列2个了。

相关问题

让两个div横向排列 一个顶部一个居中

可以使用 flex 布局来实现这个需求。首先，将两个 div 包裹在一个父容器中，设置该父容器的 `display` 属性为 `flex`，并设置 `flex-direction` 为 `row`，即可让两个子元素横向排列。然后，将上方的 div 的 `align-self` 属性设置为 `flex-start`，即可将其置于顶部，将下方的 div 的 `align-self` 属性设置为 `center`，即可将其居中。

HTML 代码示例：

<div class="container">
  <div class="top">顶部</div>
  <div class="middle">居中</div>
</div>

CSS 代码示例：

.container {
  display: flex;
  flex-direction: row;
}

.top {
  align-self: flex-start;
}

.middle {
  align-self: center;
}

让三个div横着排列

可以使用CSS的flex布局来实现三个div横着排列。代码如下：

HTML:

<div class="container">
  <div class="box"></div>
  <div class="box"></div>
  <div class="box"></div>
</div>

CSS:

.container {
  display: flex;
}

.box {
  width: 100px;
  height: 100px;
  background-color: #ccc;
  margin-right: 10px; /* 可以设置间距 */
}

.box:last-child {
  margin-right: 0; /* 最后一个box不设置右侧间距 */
}

以上代码将会在容器中横向排列三个宽高为100px的盒子，盒子之间的间距为10px。