添加标签到colgroups的顶部？

Question

我动态生成了colgroups，并使用背景颜色为每个组设置样式。有没有办法在每个组的顶部添加标签？

我的colgroup看起来像这样：

<colgroup>
  <col>
  <col span="3" style="background-color: #ccc;">
  <col span="3" style="background-color: #ddd;">
  <col span="3" style="background-color: #ccc;">
</colgroup>

以下是它的呈现方式：

如何在每个组的顶部放置标签？我不能选择它们进行那种改变，所以可能有一个jQuery API甚至插件吗？

Answer 1

您可以使用CSS :after（或:before）伪类。

<col span="3" class="index">

CSS：

.index {
    position:relative;
    background-color: #ccc;

}

.index:after {
      position:absolute;          
      content: "Index";
      top:0px;
      left:0px;
      color:#000000
}

您还可以将此与UTF-8字符组合使用，以用于您可能要用于排序指示符的任何字形。

请参阅：Use Font Awesome Icons in CSS