网络上表格的一个普遍问题是，当内容量很大时，它们在小屏幕上的原生效果并不好，而且使它们可滚动的方法并不明显，特别是当标记可能来自 CMS，无法添加一个包装器时。

这个例子提供了一种在小空间中显示表格的方法。我们隐藏了 HTML 内容，因为它非常大，而且没有什么特别之处。在这个例子中，研究其 CSS 代码更有用。

当查看这些样式时，你会注意到表格的 display 属性已被设置为 block。虽然允许滚动，但表格失去了一些完整性，而且表格单元格会尽量变小。为了缓解这个问题，我们在 上将 white-space 设置为 nowrap。然而，我们没有对 进行设置，以避免长标题迫使列的宽度超过显示数据所需的宽度。

为了在向下滚动时保持表头在页面上，我们在 元素上将 position 设置为 sticky。注意，我们没有将 border-collapse 设置为 collapse，因为如果我们这样做，表头就不能与表格的其他部分正确分开。