多标签宽度自适应左右横向滚动布局

可以使用flex布局来实现多标签宽度自适应左右横向滚动布局，具体实现步骤如下：

1. 创建一个父容器，设置其为flex布局，并设置overflow-x为scroll。

2. 在父容器中插入多个子元素，每个子元素代表一个标签，设置子元素的flex-shrink为1，flex-basis为auto。

3. 如果标签之间需要有间距，可以给子元素设置margin-right。

4. 如果需要添加左右箭头来控制滚动，可以在父容器的两侧分别添加一个箭头元素，并使用绝对定位来定位。

以下是示例代码：

HTML代码：

<div class="tag-container">
  <span class="arrow left-arrow">&lt;</span>
  <span class="tag">标签1</span>
  <span class="tag">标签2</span>
  <<span class="tag">标签3</span>
  <span class="tag">标签4</span>
  <span class="tag">标签5</span>
  <span class="arrow right-arrow">&gt;</span>
</div>

CSS代码：

.tag-container {
  display: flex;
  overflow-x: scroll;
  position: relative;
}

.tag {
  flex-shrink: 1;
  flex-basis: auto;
  margin-right: 10px;
}

.arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  font-size: 20px;
  cursor: pointer;
}

.left-arrow {
  left: 0;
}

.right-arrow {
  right: 0;
}