懸停對<hr>的影響表

我有一個表格，其中包含< hr>，標題和正文。我把懸停效果放在整個表上，但是對於< hr>，只有當鼠標懸停在行上時，鼠標懸停在表上時它纔會改變顏色。只要鼠標碰到桌子，我就需要它改變顏色。我嘗試了各種各樣的東西，但似乎都沒有奏效。懸停對<hr>的影響表

當鼠標懸停在桌子上的任何位置時，如何獲得< hr>一行以將顏色更改爲像表格其餘部分一樣的白色？ JSFiddle

HTML：

<body> 
    <table> 
     <thead> 
      <tr> 
       <td><hr /></td> 
      </tr> 
     </thead> 
     <thead> 
      <tr> 
       <td><a href="#">This is the Header</a></td> 
      </tr> 
     </thead> 
     <tbody> 
      <tr> 
       <td><a href="#">some row content</a></td> 
      </tr> 
     </tbody> 
    </table> 
</body>

CSS：

hr{ 
border:1px solid; 
float:left; 
align:left; 
width:30%; 
background-color:#991f33; 
color:#991f33; 
} 
hr:hover{ 
background-color:#fff; 
color:#fff; 
} 

table { 
    border:0; 
    background-color:#dcdcdc; 
    text-align:left; 
    text-decoration:none !important; 
    padding:20px; 
} 

thead tr a{ 
    color: #911f33; 
} 

tbody tr{ 
    font-size:10px; 
    line-height:19px; 
    color: #911f33; 
} 

table:hover, table:hover a{ 
    color:#fff; 
    background-color:#911f33; 
} 

tr a{ 
    color:#000; 
}

來源

2014-02-18 anja

<td><hr id="hrr"/></td>

CSS是

table:hover #hrr 
{ 
     border:1px solid blue; 
}

來源

2014-02-18 13:27:01

完美，它的工作好了。非常感謝。 :-) – anja

歡迎@anja –

懸停對<hr>的影響表

回答

相關問題