如何为没有背景颜色的表格行着色？

Question

是否有任何其他CSS属性可用作＆＃39; background-color ＆＃39;的替代品。设置＆lt; tr＆gt;？

的颜色

我使用第三方工具通过JavaScript设置表格元素的颜色。我似乎无法使用CSS覆盖它，即使使用！重要即可。我也无法使用JavaScript代码。

所以我想，通过替代方法设置背景颜色可能会有效。但是我知道没有任何属性可以像背景颜色那样。

任何帮助都会很棒。

PS ：我更喜欢基于CSS的解决方案，而不是任何形式的脚本。

Answer 1

也许这适合你：

tr {
  background-color: red !important; // we want this to override
}
tr {
  background-image: linear-gradient(to bottom, blue, blue) !important;
}
tr:hover {
  background-image: linear-gradient(to bottom, green, green) !important;
}

<table>
  <tr style="background-color: red !important;">
    <td>Table Content</td>
  </tr>
</table>

Answer 2

使用非常大的插入box-shadow

＆＃13;

＆＃13;

td {
  overflow: hidden;
  /* required */
}
td:hover {
  box-shadow: 0 0 200px green inset;
}

＆＃13;

<table>
  <tr style="background-color: orange !important;">
    <td>Table Content</td>
    <td>Table Content</td>
    <td>Table Content</td>
  </tr>
  <tr style="background-color: pink !important;">
    <td>Table Content</td>
    <td>Table Content</td>
    <td>Table Content</td>
  </tr>
</table>

＆＃13;

＆＃13;

＆＃13;