如何创建具有固定列和 3 个可滚动部分的表格答案

【问题标题】：How to create a table with a fixed column and 3 scrollable parts如何创建具有固定列和 3 个可滚动部分的表格
【发布时间】：2023-03-16 10:08:02
【问题描述】：

如何创建一个看起来像图片的 HTML 表格？
就我而言，我有很多字段，我想用固定列显示重要的字段，并用可滚动条显示其他细节，
看看这张照片：

【问题讨论】：

【解决方案1】：

将此添加到 CSS 文件中，添加到您用于这些表格单元格的任何类中...

overflow-y: hidden;
overflow-x: scroll;

【讨论】：

溢出我只能制作一个可滚动的表格，不像我上面展示的图片（它有3个可滚动的部分）
您需要将 CSS class 分配给您希望以这种方式运行的表格单元格。类似<td class="sidescroll" 然后.sidescroll 的 CSS 将包含我在答案中发布了 2 行。

【解决方案2】：

我建议使用 Datatables 并使某些单元格具有滚动条已在此帖子中得到回答：here

这是一个 jsfiddle 的链接，其中包含 jQuery Datatable 和 Fixed cols 以及某些单元格上的水平条： jsfiddlejsfiddle 这要归功于上面链接的帖子中的@davidkonrad。

【讨论】：

我确实使用了 dataTable，这是我的数据表代码，像这样 imgur.com/a/Lh3Te 你给我的链接与我想要构建的链接相似，但我无法让它像图片一样（就像拥有一桌四桌）