相关疑难解决方法(0)

我需要使用 nth-child 每八个元素重复一个模式。

\xe2\x96\xa0\xe2\x96\xa1\xe2\x96\xa0\xe2\x96\xa1

\xe2\x96\xa1\xe2\x96\xa0\xe2\x96\xa1\xe2\x96\xa0

我一直在试图找出一个公式，但我似乎没有找到正确的方法。

section {\r\n  width: 220px;\r\n}\r\ndiv {\r\n  width: 50px;\r\n  height: 50px;\r\n  float: left;\r\n  margin-right: 5px;\r\n  margin-bottom: 5px;\r\n  background-color: yellow;\r\n}\r\n\r\ndiv:nth-child(4n), div:nth-child(4n+1) {\r\n  background-color: green;\r\n}

<section>\r\n  <div></div>\r\n  <div></div>\r\n  <div></div>\r\n  <div></div>\r\n  <div></div>\r\n  <div></div>\r\n  <div></div>\r\n  <div></div>\r\n  <div></div>\r\n  <div></div>\r\n  <div></div>\r\n  <div></div>\r\n  <div></div>\r\n  <div></div>\r\n  <div></div>\r\n  <div></div>\r\n</section>

\n

我需要为每5个li（包括第一个li）应用一种样式。

我试过了：

nth-child(1n+5)

但这不适用于第一个孩子。我要去哪里错了？

使用 JavaScript，我想<span>从颜色数组中更改每个样式。下面是一个例子：

HTML：

        <span>H</span>
        <span>E</span>
        <span>L</span>
        <span>L</span>
        <span>O</span>

JS：

colors=['red', 'orange', 'yellow', 'blue','green'];
[...document.querySelectorAll('span')].map( sp => {
         sp.style.color = colors[0];
         colors.shift();
});

现在我目前的想法是扩展我的选择和使用，map以便我可以遍历每个对象。目前，我正在删除正在使用的颜色中的元素。我还可以创建一个迭代器来跟踪颜色，这样它们就不会被删除。假设对象的数量和颜色的数量相同，我也可以通过 for 循环逐步完成并设置颜色。

我怎样才能做到这一点？

好吧,数学不是我的强项,我承认.

我想要做的就是在html表中选择第一行,第5行,第9行,第13行,第17行等行.任何拥有更好数学技能的人都可以指出我正确的方向或者提供一个"nth-child-for-dummies"指南吗？

我尝试了nth-child(1n + 4)(选择了第4行以及之后的所有人),并且我还尝试了nth-child(0n + 4),它选择了第四行,之后没有任何内容.

假设我有860px的宽度区域,我需要放4个div(200px宽度)和3个空间(20px).如果根本只有4个div,我可以使用

.div {width:200px; margin-right:20px}
.div:last-child {margin-right:20px;}

但是可以有任意数量的div,但仅限于一行,所以我不能使用last-child.但是一行的宽度总是860px.

如何从第四个div中删除margin-right？或者如何正确地使这个间距？

如何选择下面的无序列表中的每个其他第3个元素？我有一个随机的数量,<li>但我需要每隔3个,所以例如第三个,第九个,第十五个等等在html或css或javascript中可能是这样的事情吗？

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