更改行悬停时的字形颜色

Question

我试图在悬停 table 行时更改字形颜色。下面的 CSS 改变了除 glyphicon 之外的所有其他 td 的字体颜色。我正在使用 bootstrap 3.

CSS:

.table-custom-hover > tbody > tr:hover {
  background-color: #DD4814;
  color: #fff;
}

HTML:

<tr>
    <td><a href="#" class="glyphicon glyphicon-cog"></a></td>
</tr>

Answer 1

尝试这样的事情。目标 a .

.table-custom-hover > tbody > tr:hover a, 
.table-custom-hover > tbody > tr:hover {
 background-color: #DD4814;
 color: #fff;
 }

<td><a href="" class="glyphicon glyphicon-cog"></a></td>

Answer 2

使用 <i> 作为图标，并用 <a> 包裹起来：

<tr>
    <td a href="#">Test</td>
    <td><a href="#"><i class="glyphicon glyphicon-cog"></i></a></td> 
</tr>

更改行悬停时的字形颜色

Change glyphicon color on row hover

css

twitter-bootstrap

font-awesome