使用css选择器选择没有表格标题的表格行

使用css选择器我该如何编写一个选择器，以便只有具有数据显示光标的表格行作为指针。我尝试了下面但不是使用css选择器选择没有表格标题的表格行

table tbody tr:not(tr>th)

是这个跨浏览器和IE6的事件？

这不是一个有效的CSS选择器;你不能把组合器放在:not()里面。

最好的办法是把标题行（包含<th>元素即<tr>元素）一个<thead>内，离开行的其余部分在表的<tbody>，并简单地使用：

table tbody tr { 
    cursor: pointer; 
}

如果您不能修改你的HTML，单独使用CSS选择器是不可能的，特别是不需要支持IE6。改为使用JavaScript;这里是一个强制性的jQuery的例子：

$('table tbody tr:not(:has(th))').css('cursor', 'pointer');

2012-03-01 07:16:26 BoltClock

我m *确实*有一种方法可以用CSS3做到这一点虽然... – Purag 2012-03-01 07:18:20

@BoltClock，因为我们使用Gridview（一个asp.net控件）的样式，我们g几乎没有选择;（它们不会在'thead'内呈现'th' – Deeptechtons 2012-03-01 07:20:09

@Deeptechtons：那么恐怕你不会在CSS选择器中获得任何地方，尤其是不支持IE6。看我的编辑。 – BoltClock 2012-03-01 07:21:03

假设，你的标题行会始终是第一行，你可以这样做：

table tr:not(:first-child) { 
    background:red; 
}

这将选择所有tr元素除first-child（如在第一个匹配元素中）。

This does not work in IE6 or any other version of IE only，IE9。

但是，如果您确实需要IE6支持，则必须使用Javascript。

2012-03-01 07:26:34 Purag

您可以使用'table tr + tr'替代IE7和IE8，但IE6无法实现。 – BoltClock 2012-03-01 07:27:32

+1侧向思考 – Deeptechtons 2012-03-01 07:40:37

您可以使用<thead>标签。

在我的情况表如下所示：

<table> 
    <thead> <tr><th>... </thead> 
    <tbody> <tr><td>... </tbody> 
</table>

这将适用于所有表：

tbody tr{ 
     background: yellow; 
}

这只是其中有头表：

thead+tbody tr{ 
     background: red; 
}

2017-04-10 08:52:20

回答