nth-子 CSS 选择器

时间:2022-10-19
本文介绍了nth-子 CSS 选择器的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着跟版网的小编来一起学习吧!

问题描述

我有九组配色方案,我想将它们应用于一系列 div.使用 :nth-child(1), :nth-child(2)... 适用于前九个,但我希望之后重复该序列,但我不能围绕 (3n+2) 表示法缠绕我的头......我想我明白了,但我似乎无法哄它做我想做的事.

I have nine sets of color schemes that I want to apply to a sequence of divs. Using :nth-child(1), :nth-child(2)... works for the first nine, but I'd like the sequence to then repeat after that, and I can't wrap my head around the (3n+2) notation... I think I get it, but I can't seem to coax it into doing what I want.

这可能吗,还是我应该在写出每个 div 时只为它们应用一个类?

Is this possible, or should I just apply a class to each div as I write them out?

推荐答案

如果你的意思是你需要对每九个连续的元素应用不同的规则,你必须使用这九个选择器:

If you mean you need to apply different rules to every nine consecutive elements, you have to use these nine selectors:

:nth-child(9n+1)
:nth-child(9n+2)
:nth-child(9n+3)
:nth-child(9n+4)
:nth-child(9n+5)
:nth-child(9n+6)
:nth-child(9n+7)
:nth-child(9n+8)
:nth-child(9n+9) /* Or :nth-child(9n) */

这篇关于nth-子 CSS 选择器的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持跟版网!

上一条:对多个 HTML 标签使用相同的 ID? 下一条:Safari 错误:当使用 JS 删除项目时,first-child 不更新 display:block

相关文章

最新文章