nth-of-type 选择符中数字索引是从 0 开始还是从 1 开始?

作者:vkvi 来源:千一网络(原创) 日期:2020-6-18

CSS 选择符:div p:nth-of-type(1)

错误的说法:如果 p 是 div 的第 2 个 p 儿子,则生效。

正确的说法:如果 p 是 div 的第 1 个 p 儿子,则生效。

CSS 选择符:div p:nth-of-type(3n+1)

错误的说法:如果 p 是 div 的第 2、5、8…… 个 p 儿子,则生效。

正确的说法:如果 p 是 div 的第 1、4、7…… 个 p 儿子,则生效。

应用示例:

如果想每隔 5 个,就产生一个效果,使用:nth-of-type(5n),当 n 为 0 时,等效于 nth-of-type(0),由于索引从 1 开始,所以没有元素响应,所以第一个响应的元素是第 5 个元素。


相关文章