css - 如何将 twitter-bootstrap 图标添加为 CSS 背景图像？

Question

我有一个用于将鼠标悬停在表格上以突出显示当前行的 CSS。

.cb_table-hover tbody tr:hover td,
.cb_table-hover tbody tr:hover th {
  background-color: #cfcfcf;

}

此外，我想在同一个 CSS 中添加另一行，以在悬停表格行的背景中显示一个 twitter 引导图标。

<i class="icon-search"></i>

起初我想使用 abackground-image:url('??');但图标不能这样定义。

如果可能的话，知道吗？谢谢

Answer 1

当然 ！您不能使用图像精灵设置背景图像

但是您可以将图标放在 td/th 标签内并使用“显示”来显示/隐藏图标：

.cb_table-hover tbody tr td .icon-search,
.cb_table-hover tbody tr th .icon-search{
    display: none;
}

.cb_table-hover tbody tr td:hover .icon-search,
.cb_table-hover tbody tr th:hover .icon-search{
    display: inline-block;
}