javascript - 在不扭曲列数据的情况下添加表格列分隔符？

Question

有没有一种简单的方法可以在 HTML 表格列之间创建垂直分隔线？我想添加粗条，但我见过的唯一好方法是扭曲表格数据添加 TD。

有没有办法只使用 jQuery+CSS 在表格的列之间添加垂直分隔线？

我的表结构非常简单。

<table>
<thead><tr><th>...</tr></thead>
<tbody><tr>...</tr>...</tbody>
</table>

Answer 1

您要搜索的是标签的属性，称为规则: http://www.htmlcodetutorial.com/tables/_TABLE_RULES.html

<table rules="cols">
  <thead><tr><th>...</tr></thead>
  <tbody><tr>...</tr>...</tbody>
</table>

您可以使用 css 边框属性设置样式。但是在每个单元格上使用边框的优势在于它不会在表格的右侧(或实际上是最后一个单元格)添加边框，因此您不必为最后一个单元格添加特殊类覆盖边框。

编辑:如果您不希望整个表格周围有边框(或第一列/最后一列的左/右)，请将属性 border="0"添加到标签。

示例:http://jsbin.com/ixire