Como mudar a cor das células ao passar o mouse na tabela?

[nikaway 0]

Pessoal, eu quero que ao passar o mouse (hover) sobre as linhas de colunas, TODAS as células daquela determinada linha. mudem de cor.

 

Eu consegui que ficasse com a cor diferente só que em cada célula, e não na linha toda de células... Eu quero esse efeito aqui da cor verde ficando em todas as células da linha em que o mouse está:

 

 

 

Eu não sei como fazer isso, só sei que tenho um script que faz o efeito que eu quero e o código é esse:

 

<th width="100" bgcolor="#fff" scope="col"  onmouseover="this.className = 'rowselected';" onMouseOut="this.className = '{$row.shadeclassname}';"> </th>

E o css do código da classe .rowselected é esse:

 

.rowselected
{
    COLOR: #003399;
    BACKGROUND-COLOR: #fefcd2;
}

 

[mangakah 217]

Basicamente, você quer selecionar o elemento pai a partir do elemento filho usando a pseudo-classe. Infelizmente isso não é possível no momento. Com CSS 4, se poderia usar o marcador [inline]![/inline] para determinar qual o elemento alvo das propriedades, assim a questão poderia ser revolvida pelo seguinte:

tr! > td

Mas CSS4 não está disponível. Também há uma proposta de se criar um novo operador ([inline]<[/inline]) para apontar para o elemento pai.

 

O que se pode fazer hoje é aplicar as propriedades a todos os elementos filhos (colunas da tabela/<td>), selecionados pelo elemento pai (linhas da tabela/<tr>):

tr:hover td

[nikaway 0]

Oi mangakah, Eu consegui!! Muito obrigada! Sua resposta foi muito importante e me ajudou bastante!!



Fiz o seguinte...

Mudei o código para esse aqui adaptado:

 table.tablesorter tr:hover td{
	background-color: #F0F0F0;
	}