使用重复表头打造更具响应式的 WordPress 表格

尽管 WordPress 多年来不断进步，WordPress 表格仍是一把双刃剑。它们是展示数据的完美选择，却不利于讲述故事。如果你觉得这还不够糟糕，那就等着听听智能手机和平板电脑的情况吧：在这些设备上，你展示数据的空间甚至更少。有些表格的缺点你必须学会接受，但响应式并不在其中。.

尽管 WordPress 多年来不断进步，但 WordPress 表格的最新重大更新 WP Table Manager 为表格引入了全新的响应式设计，并增加了更多响应式选项。现在，WordPress 表格管理器推出了更新、更出色的版本，新增了一种响应式模式以及新的选项，帮助你自定义响应式表格及其行为：重复表头。

带重复表头的响应式表格

当没有足够空间显示表格时会发生什么？在之前的更新中， WP Table Manager 为您提供了两种响应式选项：添加滚动条和隐藏列。这两种模式各有其应用场景，但如果您想避免水平滚动或隐藏数据，新的第三种模式可能正是您要找的：重复表头。

重复表头响应式模式与所有其他模式一样，在有足够空间时（例如在台式设备上，如台式机或笔记本电脑）默认显示为普通表格。当空间不足时，它会折叠成一个更简单的两列表格：表头和该行的值。.

实际上，这意味着如果表格中有四列，原始表格中的每一行在响应式版本中都会表示为四个新行。每个新行只包含原始表头及其数据值。此方案适用于原始表格中的每一行，因此数据值旁边总是有一个重复的表头。.

得益于这种简单的响应式行为，重复表头表格模式让您可以在表格中添加任意数量的数据，而无需担心它在手机和平板电脑上的显示效果。此外， WP Table Manager 在较小设备上为行使用交替颜色：原始表格中的每一行都会获得不同的颜色，从而保留上下文，并让您的 WordPress 读者能够区分不同记录。.

在重复表头模式下自定义响应式表格

编辑表格时，您可以选择重复表头模式：从 格式 菜单中选择 响应式选项 ，然后在第一个下拉菜单中查找 重复表头 模式。您还可以通过两种方式自定义重复表头表格：响应式断点和响应式最大高度。

响应式断点是指当宽度低于该值时，WordPress 表格管理器插件将不再按常规方式渲染表格，而是切换到响应式的重复表头模式。你可以根据你的 WordPress 主题以及你拥有的列数来估算这个值：如果你认为表格在低于某个宽度时无法正常显示，就将该宽度用作断点。.

如果您有很多行或很多列，重复表头模式可能会创建一个非常长的页面。响应式最大高度通过在响应式模式下限制重复表头表格的高度来解决这个问题。如果响应式表格太长，您的 WordPress 读者可以像往常一样使用滚动条查看更多数据。.

响应式表格没有万能解决方案，但 WordPress 表格的重复表头模式已经非常接近了。无论你是小型表格还是包含大量行和列的大型表格， WP Table Manager的新重复表头模式都能确保你的数据在任何设备上始终完美适配。.