Dec Fathani Ответов: 1

Наведите указатель мыши на другой набор элементов таблицы


привет.. нужна помощь

i have 4 rows, 3 columns. two columns are set to orange, while in the last columns i set a background-color to green. i set background-color hover for a rows to red. also i set same background-color hover to last columns, just trying to make it highlighted when i points a mouse over it anywhere on each rows and columns. i want red color highlights all the rows and columns when a mouse points to any row/column.


<table>

   <tr>
   <td>OrangeA1</td>
   <td>OrangeB1</td>
   <td>GreenC1</td>
   </tr>

   <tr>
   <td>OrangeA2</td>
   <td>OrangeB2</td>
   <td>GreenC2</td>
   </tr>

   <tr>
   <td>OrangeA3</td>
   <td>OrangeB3</td>
   <td>GreenC3</td>
   </tr>

   <tr>
   <td>OrangeA4</td>
   <td>OrangeB4</td>
   <td>GreenC4</td>
   </tr>

</table>

table { 
  width: 300px;
  color: white;
}

tr {
  background-color: orange;
}

td:nth-child(3) {
  background-color: seagreen;
}

/*hover-start*/

tr:hover, td:nth-child(3):hover {
  background-color: red;
}

/*hover-end*/


Что я уже пробовал:

эта линия не работает
tr:hover, td:nth-child(3):hover {
  background-color: red;
}

1 Ответов

Рейтинг:
12

Eyssan

попробовать это:

tr:hover td{
  background-color: red;
}


Dec Fathani

это работает.. большое спасибо