发现问题 今天工作才发现的,原来我一直就理解错了!! 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.4k 6 个回答 得票最新 面条和果子 22 发布于 2016-12...
CSS :nth-of-type() bug CSS :nth-of-type() bug .tools-hover-box-list-item{pointer-events: auto;box-sizing: border-box;display: flex;flex-flow: row nowrap;justify-content: flex-start;align-items: flex-start;width:140px;margin-top:14px; &:nth-of-type(4n +1) {margin-top:20px; }...
See the Pen css nth-of-type bug by xgqfrms (@xgqfrms) on CodePen.
nth-of-type的关键词是type,即他关心的是类型。它不会对所有子元素生效,只会对子元素中符合选择器要求的类型的子元素进行筛选,而忽略非选择器要求的类型的子元素。ele:nth-of-type(n)的意义就是选择父元素下的第n个ele类型的子元素。 nth-child的关键词是child,它关心的是所有子元素。它会对所有子元素生效...
51CTO博客已为您找到关于css nth of type无效的相关内容,包含IT学习相关文档代码介绍、相关教程视频课程,以及css nth of type无效问答内容。更多css nth of type无效相关解答可以来51CTO博客参与分享和学习,帮助广大IT技术人实现成长和进步。
一、:nth-child 1.1 说明 :nth-child(n) 选择器匹配属于其父元素的第 N 个子元素,不论元素的类型。n 可以是数字、关键词或公式。 注意:如果第 N...
直接选中了box下的第二个span nth-of-type(2) 蓝色 并不受前面有多少个p的影响 如果改为: /* 选中box中第2个元素 */.box span:nth-child(2){background-color: red;}/* 直接选中box 下面第一个span类型的元素 */.box span:nth-of-type(2){display: inline-block;width: 20px;background-color...
CSS中 :nth-of-type()选择器的用法?请参考以下内容:工具/原料 计算机 :nth-of-type()方法/步骤 1 :nth-of-type()伪类选择器初识 2 新建一个HTML文档 3 使用nth-of-type(n)选择器,请细看注释 4 保存文件,在浏览器查看输出结果 5 :nth-of-type(n)的使用总结 注意事项 理解:nth-of-type(n)的...
nth-of-type选择器主要用于选取特定类型的子元素,且该子元素在同级同类元素中的位置符合指定的规律。