在运行时更改 tablesorter 图标的位置

Question

我在 Bootstrap 中使用 jQueryUI tablesorter 插件。我有一个 table 一列 right-aligned。我希望该列的排序图标显示在 header 的左侧而不是右侧。我该怎么做？

Answer 1

您只需要自定义 css 来覆盖（具有更高的特异性）bootstrap 主题定义。

由于未提供 HTML，this demo 右对齐 "English" 列的所有 tbody 内容，左对齐 "English" 中单元格的图标=12=].

tr td:nth-child(4) {
    text-align: right;
}
.tablesorter-bootstrap .tablesorter-header:nth-child(4) .tablesorter-header-inner {
    padding-right: 4px;
    padding-left: 18px;
}
.tablesorter-bootstrap .tablesorter-header:nth-child(4) i.tablesorter-icon {
    left: 2px;
    right: auto;
}