Javascript TableSorter：如何更改排序箭头的位置

我正在实现jquery的tablesorter。我需要更改排序箭头相对于列标题的位置

以下是我迄今为止所做的工作：

table.tablesorter thead tr .header {
    background-image: url(bg.gif);
    background-repeat: no-repeat;
    background-position: 80% 70%;
    cursor: pointer;
}

这适用于某一列，但不适用于与标题重叠或向右偏远的其他列。

---

有没有办法使箭头始终显示在列标题旁边？

您可以在更改类的列名后添加一个span。。比如：

<tr>Column 1 <span class="sort-arrow" /></tr>

第1列

---

这个问题似乎与上述问题类似，并提供了类似的解决方案：

如果使用默认的蓝色主题，则只需更改箭头的背景位置，然后添加左填充，将文本移离它-

---

截至最新的

dataTables

v.1.10.4（2014年12月8日），他们更改了课程名称。 如果您希望将排序箭头放在列标题的左侧，则应使用以下CSS以获得所需的结果：

table.dataTable thead .sorting,
table.dataTable thead .sorting_asc,
table.dataTable thead .sorting_desc,
table.dataTable thead .sorting_asc_disabled,
table.dataTable thead .sorting_desc_disabled
 {
    background-position: left center;
    padding-left: 20px;
}​

---

被接受的答案对我不起作用。为了将排序箭头保持在表格标题文本的左侧，这起到了作用：

.tablesorter-header {
  display: table-cell !important;
  vertical-align: middle !important;
  background-position: left center !important;
  padding-left: 20px;
}

.tablesorter-header-inner{
  padding-left: 25px;
}

---

但这会将排序箭头正好放在列标题旁边，而不会与文本重叠？我的帖子的重点是你添加背景而不是单元格的部分。更改机制可以用您自己的替换。很抱歉，我错过了关于JQuery tablesorter的部分（我以前没有使用过）。。tablesorter是否将箭头插入标记中，或者这是由您控制的？您需要从span标记中删除class属性，这会导致混淆。我只是在其上放置了一个类，因为我不喜欢“裸”标记（即没有内容的标记，也没有指示其功能的标记）。。当然，您可以随意删除它。这个css实际上是针对我的，我的答案是针对原始的TableSorterV2.0.5。注意：这个答案是针对原始的TableSorterV2.0.5。要移动my上的箭头，请参见@mezzoforte的答案。

.tablesorter-header {
  display: table-cell !important;
  vertical-align: middle !important;
  background-position: left center !important;
  padding-left: 20px;
}

.tablesorter-header-inner{
  padding-left: 25px;
}