Html 如何保持水平无序列表不被破坏？

我试图创建一个可以水平滚动的缩略图列表，但无论我做什么，它都会中断

这就是我现在拥有的

你知道我做错了什么吗？

---

谢谢

在

ul

上添加

空白：nowrap

：

ul {
    width: 100%;
    list-style-type: none;
    margin: auto;
    overflow-x: scroll;
    white-space: nowrap;
}

说明：

我使用了

空白

属性，因为它使我有可能处理对象中剩余的空白，所以我说它不会将出现在

ul

中的空白进行换行，并将它们全部显示在一行中。

使用nowrap

ul {

white-space: nowrap;
width: 100%;
list-style-type: none;
margin: auto;
overflow-x: scroll;

   }

ul {

white-space: nowrap;
width: 100%;
list-style-type: none;
margin: auto;
overflow-x: scroll;

   }