Question

我有unorder list，每个列表项都有div。

我的HTML是这样的。

<ul>
    <li>
      <div>.....</div>
    </li>   
    <li>
      <div>.....</div>
    </li>   
    <li>
      <div>.....</div>
    </li>   
    <li>
      <div>.....</div>
    </li>   
    <li>
      <div>.....</div>
    </li>   
    <li>
      <div>.....</div>
    </li>   
    <li>
      <div>.....</div>
    </li>   
    <li>
      <div>.....</div>
    </li>   
    <li>
      <div>.....</div>
    </li>
</ul>

我已经向每个margin添加了底部和右div（我定位的是直接位于li元素内的div'。现在我需要从每三分之一中移除边距{{ 1}}元素。（第3，第6和第9等等。）

这是我div，但它不适合我。

CSS

注意：我也尝试使用li > div { margin-right: 10px; margin-bottom: 10px; border: 1px solid #dedede; padding: 10px; } li > div:nth-of-type(3n) { margin-right: 0; }选择器。但没有运气。

希望有人能帮助我。谢谢。

Answer 1

li:nth-of-type(3n)  > div{
  margin-right: 0;
}

Answer 2

您试图选择div中的每三个li元素。由于每个div中只有一个li元素，因此未选择任何元素。您应该选择每三个li元素：

li:nth-of-type(3n) > div {
  margin-right: 0;
}

Example Here

Answer 3

您应该nth-child使用li而不是div

li:nth-child(3n) > div {
  margin-right: 0px; 
  /* other styles comes here */
}

选择CSS中的每个第三个元素

3 个答案:

DEMO