用html css实现并排放6个图片 间隔相同

以下是使用HTML和CSS实现并排放6个图片并保持间隔相同的示例代码：

HTML代码：

<div class="image-container">
  <img src="image1.jpg">
  <img src="image2.jpg">
  <img src="image3.jpg">
  <img src="image4.jpg">
  <img src="image5.jpg">
  <img src="image6.jpg">
</div>

CSS代码：

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

.image-container img {
  width: calc(33.33% - 10px);
  margin-right: 10px;
}

.image-container img:last-child {
  margin-right: 0;
}

解释：

• display: flex;将容器设置为弹性布局，以便将图像放置在同一行上并保持相同的间距。
• justify-content: space-between;将弹性容器中的项目分布在容器中，使它们之间保持相等的间距。
• width: calc(33.33% - 10px);将每张图片的宽度设置为容器宽度的1/3减去10像素的边距，以便在容器中放置三个图片。
• margin-right: 10px;为每个图像添加右边距以保持它们之间的距离相等。
• margin-right: 0;将最后一个图像的右边距设置为0，以避免在容器的右侧多余的间隔