如何将 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>

起初我想使用background-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;
}