2

我有两张同班的桌子

<table class='pp' >
  <tr class='pp'>
    <td class='pppagetitle'>A Table</td>
  </tr>
</table>
<table class='pp' >
  <tr class='pp'>
    <td class='ppinstance'>Another Table</td>
  </tr>
</table>

但只想选择具有 td 类 pppagetitle (!) 的那个 - 任何指针?

4

7 回答 7

2
.pp:nth-child(1){background:green;}

但这没有得到很好的支持(在 IE8 及更低版本中不起作用)

或者将表格放入容器中并使用

:第一个孩子

例子:

<style>
    .container > .pp:first-child{background:green;}
</style>
<div class="container">
    <table class="pp"></table>
    <table class="pp"></table>
</div>

更多文档:Quirksmode.org

于 2012-10-13T17:43:35.107 回答
1

假设他们有一个父母,我的第一个想法是:

table.pp:first-child

JS 小提琴演示

但是,如果它是其父元素的第一个子元素,这将并且可以只选择特定的table(具有该类的)。

没有:first-of-class()选择器(不幸的是)。

于 2012-10-13T17:23:18.980 回答
0

@Jason Groulx 在上一篇文章中的指针以及关于这个问题的非常详尽的答案为我解决了问题:

<style type="text/css">
.pp > .pppagetitle {
    border: 1px solid red;
}
</style>

<table class='pp' >
  <tr class='pp'>
    <td class='pppagetitle'>A Table</td>
  </tr>
</table>
<table class='pp' >
  <tr class='pp'>
    <td class='ppinstance'>Another Table</td>
  </tr>
</table>
于 2012-10-13T19:02:07.207 回答
0

您可以添加另一个类并仅选择所需的表:

<table class='pp' >
  <tr class='pp'>
    <td class='pppagetitle anotherClass'>A Table</td>
  </tr>
</table>
<table class='pp' >
  <tr class='pp'>
    <td class='ppinstance'>Another Table</td>
  </tr>
</table>
于 2012-10-13T17:22:31.893 回答
0

table.pp:first-child

支持ie7+

于 2012-10-13T17:24:37.493 回答
0

您可以使用

table.pp:first-child

或者

table.pp:nth-of-type(1)
于 2012-10-13T17:24:52.050 回答
0

您可以使用:first-child伪选择器

于 2012-10-13T17:25:26.623 回答