HTML+css用列表的方式来横相排列图片的代码

使用HTML和CSS来横向排列图片的代码如下：

<ul class="image-list">
  <li><img src="image1.jpg" alt="Image 1"></li>
  <li><img src="image2.jpg" alt="Image 2"></li>
  <li><img src="image3.jpg" alt="Image 3"></li>
</ul>

.image-list {
  display: flex;
  list-style: none;
}

.image-list li {
  margin-right: 20px;
}

.image-list li:last-child {
  margin-right: 0;
}

在这个代码中，我们使用了HTML无序列表（`<ul>`）来包含图片。我们给`<ul>`添加了一个`class`属性，用于设置样式。在CSS中，我们使用`display: flex`来设置弹性布局，从而让列表项水平排列。我们还使用了`list-style: none`来取消了列表项的默认样式，使其不带有圆点符号。在CSS中，我们使用`.image-list li`来设置每个列表项的样式，包括右侧的外边距（`margin-right`）。最后，我们使用`.image-list li:last-child`来设置最后一个列表项的外边距为0，以避免最后一张图片后面出现多余的空白。