Highlight selected row using css

Question

How we can highlight selected row in a table using css. Is there any way to do that?

Answer 1

Assuming that by "selected" you mean "hovered over by mouse":

tr:hover {background-color: #FF0000}

You could also highlight with things like 'font-weight:bold', 'color: #FF000', etc..

Answer 2

tr { background: sky-blue-pink } /* Use a real colour */
tr * { background: transparent; }

where tr is a more specific selector to indicate whatever condition you have in the DOM to represent 'selected'. This will probably be a class selector: tr.selected

Answer 3

You just have to do something like:

tr:hover { background: #FCF; }

See this example.