html 横向滚动banner

要实现横向滚动的 banner，可以使用 HTML 和 CSS 来完成。下面是一个简单的例子：

HTML 代码：

<div class="banner-wrap">
  <div class="banner-items">
    <img src="image1.jpg">
    <img src="image2.jpg">
    <img src="image3.jpg">
    <img src="image4.jpg">
  </div>
</div>

CSS 代码：

.banner-wrap {
  overflow-x: auto;
  white-space: nowrap;
}

.banner-items {
  display: inline-block;
}

.banner-items img {
  display: inline-block;
  height: 200px;
  margin-right: 10px;
}

解释一下上面的代码：

- `overflow-x: auto` 表示当 banner-items 宽度超出 banner-wrap 的宽度时，会显示横向滚动条。
- `white-space: nowrap` 表示 banner-items 中的内容不能换行。
- `display: inline-block` 使得 banner-items 中的内容横向排列。
- `margin-right: 10px` 表示每个图片之间的间距为 10px。

这样就可以实现一个简单的横向滚动的 banner 了。