Добавить метки в топ групп?

Question

Мои сгруппированные группы генерируются динамически, и они окрашивают каждую группу в цвет фона. Есть ли способ добавить метку в верхней части каждой группы?

Моя кольгруппа выглядит так:

<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 для любого символа, который вы можете использовать для индикатора сортировки.

Смотрите: Используйте Font Awesome Icons в CSS