MDN上的概念: 某个元素:nth-of-type(n)这个CSS 伪类是针对具有一组兄弟节点的标签, 用 n 来筛选出在一组兄弟节点的位置。 某个元素:nth-child(n)这个CSS 伪类首先找到所有当前元素的兄弟元素,, 用 n 来筛选出在当前元素的兄弟元素节点的位置。 我们可以注意到:nth-of-type他是当前元素的兄弟元素的第n个,...
MDN上的概念: 某个元素:nth-of-type(n)这个CSS 伪类是针对具有一组兄弟节点的标签, 用 n 来筛选出在一组兄弟节点的位置。 某个元素:nth-child(n)这个CSS 伪类首先找到所有当前元素的兄弟元素,, 用 n 来筛选出在当前元素的兄弟元素节点...
发现问题 今天工作才发现的,原来我一直就理解错了!! MDN官网对这个选择器的的定义是: :nth-of-type() 这个 CSS 伪类是针对具有一组兄弟节点的标签, 用 n 来筛选出在一组兄弟节点的位置。 /* 在每组兄弟元素中选择第四个 元素 */ p:nth-of-type(4n) { co
下面带你彻底弄懂它们之间的区别。 MDN上的概念: 某个元素:nth-of-type(n)这个CSS 伪类是针对具有一组兄弟节点的标签, 用 n 来筛选出在一组兄弟节点的位置。 某个元素:nth-child(n)这个CSS 伪类首先找到所有当前元素的兄弟元素,, 用 n 来筛选出在当前元素的兄弟元素节点的位置。 我们可以注意到:nth-of-ty...
MDN官网对这个选择器的的定义是: :nth-of-type() 这个 CSS 伪类是针对具有一组兄弟节点的标签, 用 n 来筛选出在一组兄弟节点的位置。 /* 在每组兄弟元素中选择第四个 元素*/ p:nth-of-type(4n) { color: lime; } 重点来了!!!他说明的是标签,针对的只是标签,因此,比如网上关于这个问题的代码: ...
根据MDN文档的定义，某个元素:nth-of-type(n) 是针对一组具有兄弟节点的标签，用于筛选出该组兄弟节点中的第n个元素。与此相对，某个元素:nth-child(n) 则首先查找当前元素的所有兄弟元素，然后筛选出当前元素的第n个兄弟节点。关键区别在于它们的筛选范围。nth-of-type关注的是当前元素的直接兄弟...
MDN上的概念: 某个元素:nth-of-type(n)这个CSS 伪类是针对具有一组兄弟节点的标签, 用 n 来筛选出在一组兄弟节点的位置。 某个元素:nth-child(n)这个CSS 伪类首先找到所有当前元素的兄弟元素,, 用 n 来筛选出在当前元素的兄弟元素节点的位置。
今天学习了css选择器,发现有两个伪类nth-of-type和nth-child在功能上十分相似,却又有不同的地方。但我发现无论是在MDN上,还是在w3school、菜鸟教程上,对这两个伪类选择器的对比说的都不是很明白。这篇文章就是对这两个伪类的简单探究~ nth-of-type和nth-child的区别 ...
因为是 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个子元素;那么...
:nth-of-type MDN CSS3 选择器:nth-child 和:nth-of-type 之间的差异 张鑫旭 The Difference Between :nth-child and :nth-of-type css-tricks 关于我 如果你觉得这篇文章对你有帮助, 请点个赞或者分享给更多的道友。 也可以扫码关注我的微信订阅号 - [前端雨爸], 第一时间收到技术文章, 工作之余我会...