影响悬停

Question

其他元素的孩子的风格，我可以做到这一点的JavaScript，但我怎么会去只用CSS实现这一点：

<table> 
    <tr> 
     <td> 
      Hover <a href="#info">me</a> 
     </td> 
    </tr> 

    <tr> 
     <th id="info"> 
      Info 
     </th> 
    </tr> 
</table> 

当锚链接被徘徊在所有我想要的是，该表标题“信息”受到影响。这些都是我试图无效的：

a:hover #info 
{ 
    text-decoration: underline; 
} 

a:hover table tr > th#info 
{ 
    text-decoration: underline; 
} 

我错过了什么？

Answer 1

你不能选择的链接做到这一点，但你可以针对父tr

这是因为no parent selector或previous sibling selector

tr:hover + tr th#info { 
 
    text-decoration: underline; 
 
    background: red; 
 
} 
 
a { 
 
    display: inline-block 
 
}

<table> 
 
    <tr> 
 
    <td> 
 
     Hover <a href="#info">me</a> 
 
    </td> 
 
    </tr> 
 

 
    <tr> 
 
    <th id="info"> 
 
     Info 
 
    </th> 
 
    </tr> 
 
</table>