Html 使用colgroup和col元素将表拆分为带边框的组

使用CSS和纯HTML的组合，我试图得到一个包含3组列的表。我只希望组具有垂直规则：

以下是我到目前为止的情况：

colgroupcol{
左边框：1px实心#ccc；
右边框：1px实心#ccc；
}
tr.secondary-th{
边界：0！重要；
文本对齐：居中；
}

商人
净空路径
SKU
商品
受限制的
首席运营官
量
销售价格
航运
处理
保险
国际航运
国际处理
职责
税
经纪业务占比

CSS属性被继承到span属性覆盖的每一列中。为防止这种情况发生：

• 创建三个
  元素。第一个colgroup获得span属性，没有子级，共有五列

• 第二个
  获取四个独立的
  元素，第三个获取五个元素

• 根据类的需要为每列应用左边框或右边框

多个colgroup在语义上也有意义；匹配数据的分组

---

奖励：您可以使用此选项而不是类：

colgroup col:first-child {
  border-left: 1px solid #ccc;
}

---

完整示例

colgroup.leftBorder{
左边框：1px实心#ccc；
}
ColgroupRightBorder{
右边框：1px实心#ccc；
}
表tr.th顶置集管{
文本对齐：居中；
边界：没有！重要；
}

商人
净空路径
SKU
商品
受限制的
首席运营官
量
销售价格
航运
处理
保险
国际航运
国际处理
职责
税
经纪业务占比

谢谢！我不知道colgroups是这样工作的。过去我真的没有接到过很多电话。“相当整洁！”史蒂夫-我承认，我从来没有用过它们！我必须参考以确保我给出了正确的建议：D他们真的很整洁，一定要尝试一下

：第一个孩子
的想法，它应该在IE 8中工作，并且可以消除上课的需要。