How do I change the hover over color for a hover over table in Bootstrap?

Question

I have a table with class \'table-hover\'. The default hover over color is a white / light grey. How do I change this color?

I\'ve tried overwriting the default by ad

Answer 1

This was the most simple way to do it imo and it worked for me.

.table-hover tbody tr:hover td {
    background: aqua;
}

Not sure why you would want to change the heading color to the same hover color as the rows but if you do then you can use the above solutions. If you just want t

Answer 2

Try Bootstrap’s .table-hover class to implement hoverable rows, for example

<table class="table table-hover">
  ...
</table>

Answer 3

.table-hover tbody tr:hover td {
    background: #ffffff;
}

Answer 4

Instead of changing the default table-hover class, make a new class ( anotherhover ) and apply it to the table that you need this effect for.

Code as below;

.anotherhover tbody tr:hover td { background: CornflowerBlue; }

Answer 5

Give this a try:

.table-hover tbody tr:hover td, .table-hover tbody tr:hover th {
  background-color: #color;
}

Answer 6

try:

.table-hover > tbody > tr.active:hover > th {
                background-color: #color;
            }