如何让一个div中的三个class不同的元素并排排列并且中间间隔空隙相同

您可以按照上面的方法使用 Flexbox 布局来实现这个效果。具体步骤如下：

1. 将包含这三个元素的父级元素设置为 display: flex;。

2. 设置父级元素的 justify-content 属性为 space-between 来让这三个元素左右分布，并且中间的间隙相等。

3. 给这三个元素设置一个相同的 margin 值来控制它们之间的间隔。

下面是一个示例代码：

HTML 代码：

<div class="container">
  <div class="item-1">元素1</div>
  <div class="item-2">元素2</div>
  <div class="item-3">元素3</div>
</div>

CSS 代码：

.container {
  display: flex;
  justify-content: space-between;
}

.item-1, .item-2, .item-3 {
  margin: 0 10px;
}

您可以根据实际需求调整 margin 值来改变元素之间的间隔大小。请注意，这里的 .item-1, .item-2, .item-3 是假设这三个元素的 class 分别为 item-1、item-2 和 item-3，您需要将它们替换成实际的 class 名称。