Нужно создать цвет фона при выборе строки таблицы

Question

Todo:

• Создание цвета фона в качестве выделения при выборе строки таблицы с помощью css или любым другим способом

Текущая таблица HTML:

<table id="ember11999" class="ember-view content-table focus-group ovalview object-table container-view highlighted">
<tbody id="ember12032" class="ember-view body-view container-view">
<tr id="ember12347" class="ember-view content-row body-row-view container-view" tabindex="0" aria-label="">
<td>...</td>
<td>...</td>
</tr>
</tbody>
</table>

Пробный CSS:

table.content-table.ovalview.highlighted tr.content-row {
    background: #FFFF99 none 0 0 repeat;
}

Когда я попробовал приведенный выше код, цвет фона влияет на всю таблицу. Но мне нужно быть только в строке выбора таблицы.

Answer 1

Прежде всего, ваш tr не имеет класса inspected, который является частью селектора css.

Если после добавления класса он все еще не работает, во многих случаях td имеют фон (от вашего css), поэтому он "скрывает" фон tr. Может быть, это тоже ваш случай. Измените свой стиль на td s.

table.content-table.ovalview.highlighted tr.content-row.inspected td {
    background: #FFFF99 none 0 0 repeat;
}

Answer 2

Исходя из вашего вопроса, это то, что вы хотите достичь?

table.content-table.ovalview.highlighted tr.content-row.inspected:focus {
    background: #FFFF99 none 0 0 repeat;
}

<table id="ember11999" class="ember-view content-table focus-group ovalview object-table container-view highlighted">
<tbody id="ember12032" class="ember-view body-view container-view">
<tr id="ember12347" class="ember-view content-row body-row-view container-view inspected" tabindex="0" aria-label="">
<td>Click</td>
<td>me</td>
</tr>
<tr id="ember12347" class="ember-view content-row body-row-view container-view inspected" tabindex="0" aria-label="">
<td>Click</td>
<td>me</td>
</tr>
</tbody>
</table>

Надеюсь, я помог.

Answer 3

Попробуйте это

table.content-table.ovalview.highlighted tr.content-row.inspected {
    background: #FFFF99;
}

или

table.content-table.ovalview.highlighted tr.content-row.inspected {
    background-color: #FFFF99;
}