创建包含容器的水平滚动，并将其绘制为背景颜色

<div id="scroll-container">
  <!-- 在这里添加需要滚动的内容 -->
</div>

#scroll-container {
  overflow-x: scroll;
  background-color: #f2f2f2;
  white-space: nowrap; /* 防止内容换行 */
}

<div id="scroll-container">
  <span>内容1</span>
  <span>内容2</span>
  <span>内容3</span>
  <!-- 添加更多内容 -->
</div>

var container = document.getElementById("scroll-container");

// 向左滚动
function scrollLeft() {
  container.scrollLeft -= 100; // 每次滚动100像素
}

// 向右滚动
function scrollRight() {
  container.scrollLeft += 100; // 每次滚动100像素
}