CSS nth-child 1-6、7-12 等

标签 css css-selectors

我正在尝试按如下方式设置子元素的样式

1、7、13 等

2、8、14 等

3、9、15 等

4、10、16 等

5、11、17 等

6、12、18 等

我可以使用什么第 nth-child 语法来实现这一点?

最佳答案

你可以使用:nth-child(6n+1), :nth-child(6n+2), :nth-child(6n+ 3), :nth-child(6n+4)

引用文献:http://w3.org/TR/css3-selectors/#nth-child-pseudo , http://w3.org/TR/css3-selectors/#selectors (感谢@NayukiMinase)

另外,这里有一个很好的例子:Useful :nth-child Recipes - CSS-Tricks

关于CSS nth-child 1-6、7-12 等,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6984946/

相关文章:

javascript - 有没有办法将 ngClass 附加到伪类?

html - img 上的 href 链接

javascript - 从另一个页面打开 Bootstrap 选项卡(在 Accordion 中)

javascript - 使用 javascript 设置屏幕方向、宽度和高度

html - 类中的后代选择器

javascript - 应用 li :nth-child selector to total li count, 不使用新的 ul 重置

css - Pattern Lab "not mix well"是否带有 Angular?

php - 带有 php 的动态导航栏工作正常但是当尝试使用 foreach 获取错误输入子菜单时

带连字符/破折号的 CSS 选择器

css - 如何使用第 n 个子表达式设置每一行或列表的最后一个元素的样式