您好我有一个填充php的表,它具有交替的行颜色并且工作正常,我现在要做的是在突出显示时更改表格行中文本的颜色。
下面的代码显示了表格突出显示,其工作正常,但我无法更改颜色元素。
<tr class="active" bgcolor="#363636" onMouseOver="this.bgColor='gold';" onMouseOut="this.bgColor='#363636';" onMouseOver="this.color='#fff';">
答案 0 :(得分:1)
您可以使用css:
tr:hover {
color: White;
}
您可以使用CSS重做所有项目
tr {
background-color: #363636;
}
tr:hover {
background-color: Gold;
color: White;
}
答案 1 :(得分:0)
使用this.style.color
代替this.color
,您可以在同一属性中设置所有内容:
onMouseOver="this.bgColor='gold'; this.style.color='#fff';"
顺便试着避免像这样的内联javascript,所以你将html / css和你的javascript代码分开。
答案 2 :(得分:0)
您有两个有冲突的onMouseOver
属性。而不是这样做,为什么不使用:hover
伪类?
tr {
background-color: #363636;
}
tr:hover {
background-color: gold;
color: #ffffff;
}
如果您真的想使用onMouseOver
,可以这样做:
oneMouseOver="this.bgColor='gold'; this.color='#ffffff';";
答案 3 :(得分: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';">