0

嗨，我有一个 php 填充表，它具有备用行颜色并且工作正常，我现在要做的是在突出显示时更改表行中文本的颜色。

下面的代码显示了表格突出显示，它工作正常，但我无法更改颜色元素。

 <tr class="active"  bgcolor="#363636" onMouseOver="this.bgColor='gold';" onMouseOut="this.bgColor='#363636';" onMouseOver="this.color='#fff';">
4

4 回答 4

1

您可以使用 css：

tr:hover {
    color: White;
}

您的所有项目都可以使用 CSS 重做

tr {
  background-color: #363636;
}

tr:hover {
  background-color: Gold;
  color: White;
}
于 2013-06-04T21:55:39.197 回答
0

使用this.style.color代替this.color，您可以将其全部设置在同一个属性中：

onMouseOver="this.bgColor='gold'; this.style.color='#fff';"

顺便说一句，尽量避免像这样的内联 javascript，这样你就可以将 html/css 和你的 javascript 代码分开。

于 2013-06-04T21:55:32.507 回答
0

你有两个相互冲突的onMouseOver属性。与其这样做，为什么不使用:hover伪类呢？

tr {
    background-color: #363636;
}

tr:hover {
  background-color: gold;
  color: #ffffff;
}

如果你真的想使用onMouseOver，你可以这样做：

oneMouseOver="this.bgColor='gold'; this.color='#ffffff';";
于 2013-06-04T21:56:47.590 回答
0

根据每行中是否有多个列，您可以通过几种不同的方式更新文本的样式。我在JSFiddle中测试了这两个，它们都可以工作。

如果您只想在将鼠标悬停在特定单元格上时更新颜色：

 <tr class="active"  bgcolor="#363636" onMouseOver="this.bgColor='gold';" onMouseOut="this.bgColor='#363636';" >
      <td onMouseOver="this.style.color='#fff';" onMouseOut="this.style.color='#000';">
        hey
      </td>
    </tr>

如果您希望在将鼠标悬停在行中的任何单元格时更新颜色：

<tr class="active"  bgcolor="#363636" 
   onMouseOver="this.bgColor='gold';this.style.color='#fff';" 
   onMouseOut="this.bgColor='#363636';this.style.color='#000';">
于 2013-06-04T21:57:14.937 回答