Question

我需要应用这个css：

tr tr:nth-child(even) { 
    background-color: #E6E6E6"; 
}

到这个标签：

<tr style=.......

有人能帮助我吗？

Answer 1

你的css不工作的原因是：

您的css正在尝试在另一个tr标记内找到tr标记，因此，您应该写tr tr:nth-child而不是写tr:nth-child。
十六进制代码#E6E6E6"之后有一个双引号。

不幸的是，将:nth-child选择器放在样式属性中是不可能的，请尝试这样做：

＆＃13;

tr:nth-child(even) {
  background-color: #E6E6E6;
}

＆＃13;

<table>
  <tr>
    <td>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</td>
  </tr>
  <tr>
    <td>Nam at nunc gravida, commodo eros vel, ultrices metus.</td>
  </tr>
  <tr>
    <td>Etiam eleifend porttitor pulvinar.</td>
  </tr>
  <tr>
    <td>Cras cursus ut erat convallis porttitor.</td>
  </tr>
</table>

＆＃13;

Answer 2

认为我不能很好地理解你的问题，但如果我正确地解释它，我可以这样做：

＆＃13;

tr:nth-child(2) { 
  background-color: blue;
}
tr:nth-child(4) { 
  background-color: black;
}
tr:nth-child(6) { 
  background-color: brown;
}
tr:nth-child(8) { 
  background-color: green;
}
tr:nth-child(10) { 
  background-color: pink;
}

＆＃13;

<table class="table">
  <tr>
    <td>Text..</td>
  </tr>
  <tr>
    <td>
      Text..
    </td>
  </tr>
  <tr>
    <td>
      Text..
    </td>
  </tr>
  <tr>
    <td>
      Text..
    </td>
  </tr>
  <tr>
    <td>
      Text..
    </td>
  </tr>
  <tr>
    <td>
      Text..
    </td>
  </tr>
  <tr>
    <td>
      Text..
    </td>
  </tr>
  <tr>
    <td>
      Text..
    </td>
  </tr>
  <tr>
    <td>
      Text..
    </td>
  </tr>
  <tr>
    <td>
      Text..
    </td>
  </tr>
</table>

＆＃13;

还要确保您的HTML和CSS经过W3C验证，您的问题也存在问题，同时TR＆gt; TR：n ......为什么因为tablerow中的tablerow不是W3C验证指南。在此处查看您的代码：https://validator.w3.org/#validate_by_input

表上的类表不是必需的，因为使用table是CSS的默认标记。

Answer 3

这不起作用

tr tr：nth-child（even）{background-color：＃E6E6E6“;}

你的背景颜色有双引号十六进制值，不需要引用。

您可以尝试

table tr:nth-child(even){
  background-color: #E6E6E6;
}

<table width="100%" border="1">
  <tr>
    <td>VIOLA</td>
  </tr>
  <tr>
    <td>VIOLA</td>
  </tr>
    <tr>
    <td>VIOLA</td>
  </tr>
    <tr>
    <td>VIOLA</td>
  </tr>
    <tr>
    <td>VIOLA</td>
  </tr>
    <tr>
    <td>VIOLA</td>
  </tr>
    <tr>
    <td>VIOLA</td>
  </tr>
</table>

HTML行样式，第n个孩子

3 个答案: