方法2:使用 :not(:nth-of-type(1)) 不选择第一个子标签 :not(:nth-of-type())选择器允许你选择序列中的一个或多个元素。如果只使用(:nth-of-type(1)),选择器将选择第一个子元素;但是,当:not放在它前面时,第一个元素将被排除在外。 让我们使用以下示例清楚:not(:nth-of-type(1))概念。 例子 在...
此时如果改成div:nth-child(2)就能选到第一个div: :nth-last-child()只是从指定元素的最后一个兄弟元素开始计数,其他同理,略 :nth-of-type(n) & :nth-last-of-type(n) :nth-of-type(n):选择指定元素的兄弟元素中第n个该元素 :nth-last-of-type(n):选择指定元素的兄弟元素中第n个该元素,从最后...
:nth-of-type 计算公式:a * n的倍数 + b; (n是从0,1,2...开始) :nth-of-type(an + b):是基于相同的兄弟标签元素匹配 div p:nth-of-type(1){background-color:orange;} 这是h32 :nth-last-of-type :nth-last-of-type():是基于相同的兄弟标签元素从后往前匹配 div h5:nth-last-of-type(...
:nth-last-of-type(n)和:nth-last-child(n) 与:nth-of-type(n)和:nth-child(n)基本一致,只是从后面开始计数 结合:nth-last-child(n)与:first-child可以匹配出列表中不同元素数量的不同样式 比如:nth-last-child(3):first-child表示从后往前数选中第3个子元素,同时也是第一个元素,那么就可以判断改列表...
因为是 ntf-of-type 的值是匹配第 2 个元素的,可以看 MDN 上 nth-of-child 的解释,是一样的:https://developer.mozilla.org/zh-CN/docs/Web/CSS/:nth-child 有用 回复 cesiya23: :nth-of-type(i)是找到父元素中第i个符合条件的元素;:nth-of-child(i)是找到父元素中符合条件的第i个子元素;那么...
发现问题 今天工作才发现的,原来我一直就理解错了!! MDN官网对这个选择器的的定义是: :nth-of-type() 这个 CSS 伪类是针对具有一组兄弟节点的标签, 用 n 来筛选出在一组兄弟节点的位置。 /* 在每组兄弟元素中选择第四个 元素 */ p:nth-of-type(4n) { co
<!DOCTYPE html> Document .test:nth-of-type(1) { background: pink; } 123 123 123 123 实在是想不出为什么没有会选不中,Why? 我的理解是:h1.test标签的父元素下的第一个有.test类的元素。css 有用2关注6收藏1 回复 阅读13.5k 6 个回答 得票最新 面条和果子 22 发布于 2016-12...
nth-child代表第几个元素 nth-of-type代表这个类型是第几个元素 例: p:nth-of-type(1):就算p不是第一个子元素,也可以取到,因为p在这个div中是第一个出现的p元素 nth-child就是第几个子元素了,就是按子元素个数算的
nth-of-type(n)与nth-child(n)中的n可以是数字、关键词或公式。 数字:也就是上面例子的使用,就不做赘述。 关键词:Odd 、even Odd 和 even 是可用于匹配下标是奇数或偶数的子元素的关键词 注意:第一个子元素的下标是 1 在这里,我们为奇数和偶数 p 元素指定两种不同的背景色: ...
一、nth-child( ) 与 nth-of-type( )的定义与用法 nth-child(n) : 匹配父元素中的第 n 个子元素,元素类型没有限制。 nth-of-type(n) : 匹配同类型中的第n个同级兄弟元素。 n可以是一个数字,一个关键字,或者一个公式,比如:nth-child(odd) 奇数 ,nth-child(even) 偶数。