tr : 호버링이 작동하지 않는 이유

나는 CSS에 약간 익숙하며이 작은 문제에 집착하고 있습니다. 행 위로 마우스를 가져 가면 테이블 행의 배경색이 변경되기를 원합니다. 아래에 코드를 작성했지만 어떻게 든 호버링 부분 만 작동하지 않는 것 같습니다. Google 크롬 v24 및 Firefox v18에서 보았습니다. 아무도 내가 어디가 잘못 됐는지 말할 수는 없었어. 감사. 그것은이 작동tr : 호버링이 작동하지 않는 이유

<!DOCTYPE HTML> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
<title>Untitled Document</title> 
<style> 
    table.contacts 
    { 
     width: 580px; 
     background-color: #fafafa; 
     border: 1px #000000 solid; 
     border-collapse: collapse; 
     border-spacing: 0px; 
    } 

    .contacts th 
    { 
     background-color: #99CCCC; 
     font-family: Verdana; 
     text-align: left; 
     border-bottom:1px #000000 solid; 
     font-weight: bold; 
     font-size: 12px; 
     padding:4px; 
     margin:4px; 
     color: #404040; 
    } 

    .contacts td 
    { 
     border-bottom: 1px #6699CC dotted; 
     text-align: left; 
     font-family: Verdana, sans-serif, Arial; 
     font-weight: normal; 
     font-size: .7em; 
     color: #404040; 
     background-color: #fafafa; 
     padding:4px; 
     margin:4px; 
    } 

    table tr:hover 
    { 
     background-color:blue; 
    } 
</style> 
</head> 

<body> 
    <table class="contacts" cellspacing="2"> 
     <tr>  
      <th>Subscription Scheme</th> 
      <th>Amount</th> 
     </tr> 
     <tr> 
      <td>Monthly Subscription(Family)</td> 
      <td>Rs 200</td> 
     </tr> 
     <tr> 
      <td>Monthly Subscription(Individuals)</td> 
      <td>Rs 100</td> 
     </tr> 
     <tr> 
      <td>Monthly Subscription(Company)</td> 
      <td>Rs 500</td> 
     </tr> 
     <tr> 
      <td>Yearly Subscription(Family)</td> 
      <td>Rs 2000</td> 
     </tr> 
     <tr> 
      <td>Yearly Subscription(Company)</td> 
      <td>Rs 5000</td> 
     </tr> 
     <tr> 
      <td>Festival Subscription</td> 
      <td>Rs 1000</td> 
     </tr> 

    </table> 
</body> 
</html>

출처

2013-02-05 Jeris Alan

, 당신은 단지 td 요소의 background-color가 tr 요소의 background-color을 숨기고 있기 때문에 작동 표시되지 않는. 대신 다음을 사용하십시오 :

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

출처

2013-02-05 18:01:07

고마워 David..it worked :) –

당신은 매우 환영합니다. =) –

tr : 호버링이 작동하지 않는 이유

답변

관련 문제