我正在使用 twitter-bootstrap 3 开发一个网页，有些表格不适合我的页面边距。它们溢出来了。所以我想创建一个像 Excel 电子表格一样工作的结构。
最左边的两列（蓝色区域）将被固定，其余的列将尽可能显示。如果用户向右滚动表格的滚动条，将显示溢出的列。你可以看到我想要的图片。
Putting the table into a div and rule the div overflow-x:scroll is not a solution for me. Because The first two columns must be visible all the time.
有一个解决方案here http://zurb.com/playground/responsive-tables我已经尝试过了。仅当我将窗口缩小为较小的宽度值时它才起作用。
在我看来，你可以使用jquery数据表 http://datatables.net/随着固定列 http://www.datatables.net/extensions/fixedcolumns/插件 - 默认情况下它完全符合您的要求。只需包含 jquery.dataTables.js 和 jsfixedColumns.min.js （以及 css 文件）CDN http://cdn.datatables.net/并初始化你的表：
var table = $('#example').DataTable( {
sScrollX: "100%",
sScrollXInner: "150%",
bScrollCollapse: true
});
new $.fn.dataTable.FixedColumns(table);
参见演示->http://jsfiddle.net/n2x8W/ http://jsfiddle.net/n2x8W/
dataTables 支持 bootstrap，您可以根据需要设置表格样式。在示例中，我刚刚包含了不太现代的默认 CSS。请注意，初始化公开了 dataTables 的基本功能，如分页、过滤等。如果您不需要/不想要它们，它们可以很容易地被关闭。
另请注意，我使用的是 1.9.4 版本，因为根据我的经验，它比 1.10.x 更稳定。