如何在HTML和CSS中移除图片横向滚动容器的滚动条？

你的滚动条来自.scroll-wrapper元素的overflow-x: auto设置，要隐藏它但保留滚动功能，可以通过以下CSS修改实现：

.scroll-wrapper {
  width: 80%;
  display: flex;
  overflow-x: auto;
  scroll-behavior: smooth;
  /* 隐藏滚动条 */
  -ms-overflow-style: none; /* IE 和 Edge */
  scrollbar-width: none; /* Firefox */
}

/* Chrome, Safari 和 Opera */
.scroll-wrapper::-webkit-scrollbar {
  display: none;
}

说明： #

• -ms-overflow-style: none：适配IE和Edge浏览器，隐藏滚动条
• scrollbar-width: none：适配Firefox浏览器，隐藏滚动条
• ::-webkit-scrollbar { display: none }：适配Chrome、Safari、Opera等WebKit内核浏览器，隐藏滚动条

修改后滚动条会被完全隐藏，但容器的横向滚动功能不受影响，完全兼容你后续通过按钮控制滑动的需求。

内容的提问来源于stack exchange，提问作者Arturo Alonso