第n个子(偶数)不适用于我的css选择器 - 腾讯云开发者社区 - 腾讯云

开发者社区

文档建议反馈控制台

最新优惠活动

文章/答案/技术大牛

发布

常用的CSS3选择器

:nth-child(n)和:nth-last-child(n)选择器使用:first-child选择器和:last-child选择器可以选择某个父元素中第一个或最后一个子元素，但是如果用户想要选择第...2个或倒数第2个子元素，这两个选择器就不起作用了。...n 个子元素和倒数第n个子元素，而:nth-child(n)和:nth-last-child(n)选择器用于匹配属于父元素的第 n 个子元素和倒数第n个子元素，与元素类型无关。...:nth-of-type的值还可以设为odd或2n-1（奇数），even或2n（偶数），即为选择所有排序为奇数或偶数的元素 :empty选择器 :empty选择器用来选择没有子元素或文本内容为空的所有元素...比如：用:only-child选择器来修饰的嵌套元素，看是否起作用。 <!

4.1K2 0

CSS 01 准备选择器、伪元素

CSS3 浏览器支持情况网址查询：caniuse.com CSS3的伪类选择器（一）动态伪类选器 a:link{} a:visited{} a:hover{} a:active{} UI元素状态伪类选择器... html部分： // disable 是状态 CSS部分：（根据状态确定样式） input :enable{} input:disable{} CSS3的伪类选择器（二）结构伪类选择器...部分 li:fist-child{} 元素的第一个子元素选中 li:last-child{} 元素的最后一个子元素选中 li:nth-child...(****){} 选中顺序从左往右 li:nth-child(2n){} 元素的第偶数个子元素选中 li:nth-child(2n+1){} 元素的第奇数个子元素选中...li:nth-child(n+5){} 元素从第5个子元素开始选中 li:nth-child(4n+1){} 元素每4个元素选中

9344 0

您找到你想要的搜索结果了吗？

是的

没有找到

jquery获取第几个子元素_js获取元素的指定子元素

元素；对于$(”label:only-child“)会选出是label元素，同时它是它父类唯一的子元素的label元素； :nth-child(n)：返回第n个子节点，n从1开始，如果n取0，...如：[*]li:nth-child(2)返回li元素，并且该元素是其父元素的第二个子元素； :nth-child(even|odd)：返回偶数或奇数的子节点； :nth-child(An+B)：返回满足表达式...An+B的所有子节点，比如3n+1返回所处位置为父节点子元素的是3的倍数加1的那个子元素； :even：页面范围内的处于偶数位置的元素，如：li:even返回全部偶数li元素； :odd：页面范围内的处于奇数位置的元素...(n)：第n个匹配元素(不包括)之后的元素(n从0开始)，如：ul:gt(2)返回从第3个ul开始的所有ul元素(含第三个)； :lt(n)：第n个匹配元素(不包括)之前的元素(n从0开始)，如：ul...利用css选择器进行选择：元素标签名：比如说(”a“)会选出所有链接元素； #id：通过元素id进行选择，比如说(“#form1”)会选择id为form1的元素； .class：通过元素的CSS类来选择

27.2K3 0

css选择器选择奇数行或偶数行

css选择器选择奇数行或偶数行实现方式有两种方式一:nth-child /* 奇数行*/ div:nth-child(odd){ } /* 偶数行 */ div:nth-child(even)...{ } :nth-child(n) 选择器匹配属于其父元素的第 N 个子元素，不论元素的类型。...方式二:nth-of-type /* 奇数行*/ div:nth-of-type(odd){ } /* 偶数行 */ div:nth-of-type(even){ } nth-of-type(...n) : 匹配同类型中的第n个同级兄弟元素。...区别：其实两者使用起来基本上是一样的，既然我们设置奇偶样式，大多数情况也都是给同类型标签进行设置的。参考

2.4K1 0

前端学习(15)~css3学习(九)：选择器详解

比如说，我们用属性选择器去匹配标签的className，是非常方便的这里我们用class属性来举例。代码举例： CSS3又新增了其它的伪类选择器。这一小段，我们来学习CSS3中的结构伪类选择器：即通过结构来进行筛选。 1、格式：（第一部分） E:first-child 匹配父元素的第一个子元素E。...E:last-child 匹配父元素的最后一个子元素E。 E:nth-child(n) 匹配父元素的第n个子元素E。注意，盒子的编号是从1开始算起，不是从0开始算起。...E:nth-child(odd) 匹配奇数 E:nth-child(even) 匹配偶数 E:nth-last-child(n) 匹配父元素的倒数第n个子元素E。...（当n小于1时无效，因为n = 0 也是不会选中的）如果选择器写成li:nth-child(2n)，则表示所有的第偶数个 li。

5102 0

CSS选择器

下述内容主要讲述了《HTML5权威指南》第17、18章关于“使用CSS选择器（第I部分、第II部分）”。一、前传 1....CSS标准化在模块定义不太稳定的阶段，浏览器会采用厂商前缀实现某个特性。它允许早起采纳者试用浏览器实现的新属性。...选择器说明 :root 匹配文档中的根元素（返回html元素） :first-child 选择元素的第一个子元素 :last-child 选择元素的最后一个子元素 :only-child 选择元素的唯一子元素...:only-of-type 选择元素指定类型的唯一子元素 :nth-child(n) 选择父元素的第n个子元素 :nth-last-child(n) 选择父元素的倒数第n个子元素 :nth-of-type...(n) 选择父元素定义类型的第n个子元素 :nth-last-of-type(n) 选择父元素定义类型的倒数第n个子元素示例：子元素选择器 <!

1.4K5 1

CSS选择器详解

CSS3 E:nth-child(n) { sRules } 要使该属性生效，E 元素必须是某个元素的子元素，E 的父元素最高是 body，即 E 可以是 body 的子元素匹配父元素的第 n 个子元素...span> 第4个p 第5个p 该选择符允许使用一个乘法因子(n) 来作为换算方式，比如我们想选中所有的偶数子元素 E，那么选择符可以写成：E...(n)来作为换算方式，比如我们想选中倒数第一个子元素E，那么选择符可以写成：E:nth-last-child(1) 匹配父元素的倒数第n个子元素E，假设该子元素不是E，则选择符无效 ...，也就是说E可以是body 该选择符总是能命中父元素的第n个为E的子元素，不论第n个子元素是否为E /* 设置父元素第二个 p 元素为红色，虽然该 p 元素为父元素的第三个元素...的子元素，也就是说E可以是body 该选择符总是能命中父元素的倒数第n个为E的子元素，不论倒数第n个子元素是否为E p:nth-last-of-type(1) {

2.9K4 0

CSS基础知识

-- 结果属于第 n 个子节点(单数节点：odd，偶数节点：even) --> selector:nth-child(n) { ...查找第n个子selector，后同。 } 第 an+b 个子节点(n从0开始的递增值，a、b为数字。) --> selector:nth-child(an+b) { ... } 的属于第 n 个子节点(单数节点：odd，偶数节点：even) --> selector:nth-of-type(n) { ... } 的属于第 an+b 个子节点(n从0开始的递增值，a、b为数字。)...选择器存在优先级，优先级高的会覆盖优先级低的样式。 css中，后定义的样式会覆盖之前定义的样式。最近的祖先样式比其他祖先样式优先级高。优先级为： !

1731 0

css3的nth-child选择器的详细探讨

css3的nth-child选择器的详细探讨前言在十年前开始的div+css布局兴起之时,我就开始了CSS的学习和实践.在当年,对于CSS选择器,基本上是没有什么选择性的,只有ID选择器,CLASS...(n) :nth-of-type(n) :nth-last-of-type(n) :last-child 具体每个有什么差异,可以CSS 选择器参考手册页面进行查询....再复杂一点选择3位倍数+1的(1/4/7/10),其中的偶数 ○○○●○○○○○●12345678910 ul.list li:nth-child(3n+1):nth-child(2n){background...dd>第5个dd 要实现的效果如下,选择dt的偶数和dd的奇数, DT用圆形演示 DD用矩形演示\ ○■●□○■●□○■1dt1dd2dt2dd3dt3dd4dt4dd5dt5dd...{background: #000;} dl.dl dd:nth-of-type(2n+1){background: #06f;} 最后总结 CSS3提供的这些强大的选择器,可以让我们在具体的项目当中,

5051 0

CSS笔记(20) 非常重要

nth-child(n)选择某个父元素的一个或多个特定的子元素,注意括号里的字母只能是n. n可以是数字,关键字和公式 n如果是数字,就是选择第n个子元素,里面的数字从1开始 n可以是关键字:even偶数...,odd奇数 n可以使公式:常见的公式如下(如果n是公式,则从0jisuan,但是第0个元素的个数会被忽略) 比如说,我们想做一个隔行变色的效果,该怎么实现呢?...小结: 结构伪类选择器一般用于选择父级里面的第几个孩子. nth-child对父元素里面所有孩子排序(序号是固定的),先找到第n个孩子,然后看看是否和E匹配. nth-of type对父元素里面指定子元素进行排序选择....先去匹配E,然后再根据E找到第n个孩子....关于nth-child(n)我们要知道n是从0开始计算的,要记住常用的公式如果是无序列表,我们肯定用nth-child更多. 权重问题.类选择器,伪类选择器,属性选择器的权重都是10.

4692 0

HTML学习笔记——css基础

目录前言一、使用css修改元素的样式 1、内联样式、行内样式： 2、内部样式表： 3、外部样式表：（最佳）二、CSS基本语法三、CSS中的各类选择器 1、元素选择器： 2、 id选择器...语法： .class属性值可以同时为一个元素指定多个class属性，多个class之间用空格隔开。 4、通配选择器：作用：选中页面中的所有元素。...6、选择器分组（并集选择器）：作用：同时选择多个选择器对应的元素。语法：选择器1，选择器2，选择器3，选择器n{} 7、关系选择器：定义：父元素：直接包含子元素的元素叫做父元素。...伪类用来描述一个元素的特殊状态，比如：第一个子元素、被点击的元素、鼠标移入的元素... ...() 选中第n个子元素特殊值：n 第n n的范围0到正无穷 2n 表示选中偶数位的元素

7252 0

jQuery选择器大全(48个代码片段+21幅图演示)

子元素过滤选择器 ——5.1 :first-child和:last-child :first-child表示第一个子元素，:last-child表示最后一个子元素。...——5.3 :nth-child 看到这个就想起英文单词里的，fourth, fifth, sixth……，nth表示第n个，:nth-child就表示第n个child元素。...要注意的是，这儿的n不像eq(x)、gt(x)或lt(x)是从0开始的，它是从1开始的，英文里好像也没有zeroth这样的序号词吧。...:nth-child有三种用法： 1) :nth-child(x)，获取第x个子元素 2) :nth-child(even)和:nth-child(odd)，从1开始，获取第偶数个元素或第奇数个元素 ...例如x = 3, y = 0时就是3n，表示取第3n个元素（n>=0）。实际上xn+y是上面两种的通项式。

5K8 0

CSS3选择器 | 每个前端开发者必须要掌握的技术

:first-child 单独指定第一个子元素的样式 :last-child 单独指定最后一个子元素的样式 2....选择奇偶行 nth-child(odd)与nth-child(even): 不足之处： nth-child选择器在计算子元素时，第奇数个元素还是偶数个元素时，是连同父元素内的所有子元素一起计算的...n:所有的行 2n:每2行选择一行 3n:每3行选择一行 n+2:除第1行外所有的行 2n+4:从第4行开始隔1行选择1行 :nth-last-child(n)：从后向前选择,n为参数...n:所有行 2:倒数第2行 -n+3:最后3行 :only-child：只有一个元素时使用 4.目标伪类选择器 :target：使用该选择器来对页面中的某个target元素（锚记链接）指定样式...css伪元素：对元素中的特定内容进行操作，而不是描述状态 css3为了区分两者伪类使用单冒号，伪元素使用双冒号，但因为兼容问题现在大部分还是用单冒号 8.层级选择器相邻兄弟选择器： li + li:

7401 0

jQuery选择器大全(48个代码片段+21幅图演示)2

子元素过滤选择器 ——5.1 :first-child和:last-child :first-child表示第一个子元素，:last-child表示最后一个子元素。...——5.3 :nth-child 看到这个就想起英文单词里的，fourth, fifth, sixth……，nth表示第n个，:nth-child就表示第n个child元素。...要注意的是，这儿的n不像eq(x)、gt(x)或lt(x)是从0开始的，它是从1开始的，英文里好像也没有zeroth这样的序号词吧。...:nth-child有三种用法： 1) :nth-child(x)，获取第x个子元素 2) :nth-child(even)和:nth-child(odd)，从1开始，获取第偶数个元素或第奇数个元素...例如x = 3, y = 0时就是3n，表示取第3n个元素（n>=0）。实际上xn+y是上面两种的通项式。

1.6K8 0

css3 nth-child选择器

css3 nth-child选择器 css3的nth-child选择器，乍看起来很简单，其实不是那么容易。...简单用法 p:nth-child(n) // 选择属于其父元素的第n个子元素的每个元素 p:nth-child(2n) // 选择属于其父元素的子元素的每个偶数元素 p:nth-child...那就是n是什么？ n是从0开始的正整数，它代表着一个序列，0， 1， 2......这样的。...这和程序里面的数组起始序号还有jQuery的选择器都是不一样的。这样子就很好理解了。...+10) 就这样子的 css3中还有一些其他的子元素选择器比如 :first-child // 第一个元素 :last-child // 最后一个元素 :nth-last-child // 从最后一个子元素开始计数

5562 0

jQuery选择器大全

——1.3 :even和:odd（取偶数索引或奇数索引元素，索引从0开始，even表示偶数，odd表示奇数） $(document).ready(function () { $('tr:even').css...子元素过滤选择器 ——5.1 :first-child和:last-child :first-child表示第一个子元素，:last-child表示最后一个子元素。...——5.3 :nth-child 看到这个就想起英文单词里的，fourth, fifth, sixth……，nth表示第n个，:nth-child就表示第n个child元素。...:nth-child有三种用法： 1) :nth-child(x)，获取第x个子元素 2) :nth-child(even)和:nth-child(odd)，从1开始，获取第偶数个元素或第奇数个元素...例如x = 3, y = 0时就是3n，表示取第3n个元素（n>=0）。实际上xn+y是上面两种的通项式。

5.2K1 0

这30个CSS选择器，你必须熟记（下）

在上两篇文章里，《这30个CSS选择器，你必需熟记（上）》和《这30个CSS选择器，你必需熟记（中）》这两篇文章里，我们一起学习了前20个，本篇文章我们一起学习剩下的10个选择器。...Safari Opera 22、 X:nth-child(n) ：选择每第 n 个元素选择器如果你要匹配一组序列元素第几个元素，你可以使用 :nth-child 选择器满足这个需求，要注意的是nth-child...指序列里的第n个元素，从1开始。...我们甚至可以用按倍数进行匹配，比如选择所有4的倍数元素，li:nth-child(4n)。...X:nth-last-of-type(n)：从后往前计算选择每第n个某种元素选择器比如我们可以使用nth-last-of-type来选择倒数第n个元素。

7520 0

「HTML&CSS」第一部分

(上) 什么是 CSS3 在 CSS2 的基础上拓展、新增的样式 CSS3 发展现状移动端支持优于 PC 端 CSS3 目前还草案，在不断改进中 CSS3 相对 H5，应用非常广泛属性选择器列表...属性选择器代码演示 button { cursor: pointer; } button[disabled] { cursor: default } 八、CSS3 属性选择器(下) 代码演示...n 可以是数字、关键字、公式 n 如果是数字，就是选中第几个常见的关键字有 even 偶数、odd 奇数常见的公式如下(如果 n 是公式，则从 0 开始计算) 但是第 0 个元素或者超出了元素的个数会被忽略...(n) { background-color: lightcoral; } /* 偶数 */ ul li:nth-child(2n) { background-color:.../* 选择第 0 5 10 15, 应该怎么选 */ ul li:nth-child(5n) { background-color: orangered; } /* n + 5 就是从第

2942 0

这30个CSS选择器，你必须熟记（下）

在上两篇文章里，《这30个CSS选择器，你必需熟记（上）》和《这30个CSS选择器，你必需熟记（中）》这两篇文章里，我们一起学习了前20个，本篇文章我们一起学习剩下的10个选择器。...Safari Opera 22、 X:nth-child(n) ：选择每第 n 个元素选择器如果你要匹配一组序列元素每第几个元素，你可以使用 :nth-child 选择器满足这个需求，要注意的是nth-child...指序列里的第n个元素，从1开始。...我们甚至可以用按倍数进行匹配，比如选择所有4的倍数元素，li:nth-child(4n)。...X:nth-last-of-type(n)：从后往前计算选择每第n个某种元素选择器比如我们可以使用nth-last-of-type来选择倒数第n个元素。

5522 0

结构伪类选择器-CSS3新特性

CSS3新特性-结构伪类选择器在CSS3中新增了一个结构伪类选择器，它能用更加简洁的代码，实现我们的某些需求。...定义：结构伪类选择器主要根据的是文档的结构来选择元素，常常用在根据父级选择器选出某些想要的子元素。...n个子元素E 4 E:first-of-type 指定类型E的第一个 5 E:last-of-type 指定类型E的最后一个 6 E:nth-of-type(n) 指定类型E的第n个公式选取范围...n 所有子元素 2n 偶数子元素 2n+1 奇数子元素 5n 第5、10、15...个子元素 n+3 从第3个子元素开始（包括第3个）到最后 -n+6 前6个子元素(注意不能写成 6-n 不生效) 其中...1. n如果是数字，就是选择第n个子元素，里面数字从1开始... 2. n如果是关键字: even代表偶数，odd代表奇数 3. n可以是公式︰常见的公式如下： 4.

4863 0

点击加载更多

扫码

添加站长进交流群

领取专属 10元无门槛券

手把手带您无忧上云

扫码加入开发者社群

相关资讯

热门标签

活动推荐

运营活动

活动名称

广告关闭