腾讯云

文章/答案/技术大牛

发布

社区首页 >问答首页 >机身悬停时换头

问机身悬停时换头
EN

Stack Overflow用户

提问于 2014-08-05 08:47:12

回答 1查看 1.2K关注 0票数 0

我试图创建一个表，当鼠标在行上悬停时，第一个头行列将更改背景。我知道这可以用jQuery来完成，我只想知道我是否可以只使用CSS。

访问http://jsfiddle.net/G9G65/1/

<table>
<thead><tr><th></th><th>Title 1</th><th>Title 2</th></tr></thead>
<tbody>
    <tr><th>List 1</th><td>Data 1</td><td>Data 2</td></tr>
    <tr><th>List 2</th><td>Data 1</td><td>Data 2</td></tr>
    <tr><th>List 3</th><td>Data 1</td><td>Data 2</td></tr>
</tbody>
</table>

<style>
table tbody tr:hover {background: yellow;}
table tbody tr:hover thead tr th {background: red;}
</style>

css

html-table

回答 1

Stack Overflow用户

回答已采纳

发布于 2014-08-05 09:13:29

不幸的是，我不认为您能够实现您所追求的与css单独。

基本上，您需要一个父母兄弟姐妹选择器来完成这项工作，并且不存在这样的选择器。

虽然您可以在父元素上悬停并影响子元素，但CSS还不允许与子元素的交互影响父元素或父元素的同级。

所以..。

#parent:hover #child { /* this works */
    background: green;
}
#child:hover #parent { /* this does not work */
    background: yellow;
}

示例

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/25144185

复制

相似问题

问机身悬停时换头
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问机身悬停时换头EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问机身悬停时换头
EN