Используя CSS, как я могу изменить цвет фона строки таблицы в зависимости от ячейки, над которой я нахожу курсор? - PullRequest
Новая
       25

Используя CSS, как я могу изменить цвет фона строки таблицы в зависимости от ячейки, над которой я нахожу курсор?

3 голосов
/ 15 сентября 2011

У меня есть следующий код на моей веб-странице.Он выполняет итерацию списка, создает новые ячейки и назначает класс css новой ячейке таблицы на основе критерия (предположим, что класс .raw назначен некоторым ячейкам): 

<tr class="${(i % 2) == 0 ? 'odd' : 'even'}">
     <g:each in="${params.classProperties}" status="cnt" var="classProperty">
          <td class="${classProperty.name.contains('raw')?'raw':'normal'}">${fieldValue(bean: billTemplateInstance, field: classProperty.name)}</td>
     </g:each>
</tr>

Если ячейка была назначенакласс .raw, я установил цвет фона для ячейки.Теперь я хотел изменить весь цвет фона строки при наведении.Я попытался добавить следующие строки в мой css-файл ... 

.list td.raw {
    background: #CCFFBF;
}

.list th:hover, .list tr:hover {
    background: #b2d1ff;
}

К сожалению, при наведении мыши фоновый цвет ячеек с классом .raw остается таким же, как он был определен в ".list td.raw",Только ячейки, которым не был назначен цвет, изменяют цвет при наведении:

enter image description here

Цените всю помощь и предложения.:)

1 Ответ

6 голосов
/ 15 сентября 2011

Попробуйте добавить еще один селектор в цепочку:

.list th:hover, .list tr:hover { становится
.list th:hover, .list tr:hover, .list tr:hover td.raw {

...