：nth-​​child（）无法正常工作

Question

我正在尝试使用：nth-​​child（5）在背景上拉伸图像以进行第三次打印。 但它没有抓住。 难道我做错了什么？

table#OppPracticeOverview tr th {
    padding:5px !important;
    background-color:transparent;
}
table#OppPracticeOverview tr th img {
    width:47px;
    height:22px;
    float:left;
    margin:-5px 0 0 -42px;
    position:absolute;
    z-index:-1;
}
table#OppPracticeOverview tr th img:nth-child(5) {
    width:110px;
    height:22px;
    float:left;
    margin:-5px 0 0 -105px;
    position:absolute;
    z-index:-1;
}

HTML：

<table id="OppPracticeOverview">
<tbody>
    <tr>
        <th>
            Patients
            <img src="/images/img-CCCCCC.png">
       </th>
       <td>
       <th>
           On Hold
           <img src="/images/img-CCCCCC.png">
        </th>
        <td>
        <th>
           Reattribution Request
          <img src="/images/img-CCCCCC.png">
       </th>
       <td>
   </tr>
</tbody>

Answer 1

你几乎正确的，只要将nth-child从img到th ：像这样的table#OppPracticeOverview tr th:nth-child(5) img

演示： http ： //jsfiddle.net/G79X9/1/

Answer 2

相对于父对象，它是第n个子对象。 因此，您说的是“第5个img其父为th ”。 您的html螺钉不正确（错误），但是我认为您应该尝试定位th 。

Answer 3

我不工作，因为没有你的th有5张图片。 我想你要

table#OppPracticeOverview tr th:nth-child(5) img {...}

Answer 4

就我而言，我犯了一个小错误

.someclassA .someclassB: nth-child(odd){

您可以看到如上，someclassB：和nth-child之间有一个空格。 就是这样。通过删除该空间，它开始工作:)

Answer 5

有时nth-child不起作用，请尝试使用此nth-of-type（）

table#OppPracticeOverview tr th:nth-of-type(5) img 

这对我有用