“:nth-child(n)”是css中的一个选择器,作用是:匹配属于其父元素的第N个子元素,不论元素的类型;其中,参数“n”可以是数字、关键词或公式,例“:nth-child(3)”、“:nth-child(even)”。
本文操作环境:宏基s40-51、css3&&html5&&hbuilderx.3.0.5版、windows10 家庭中文版
(学习视频分享:css视频教程)
在 CSS 中,选择器是一种模式,用于选择需要添加样式的元素。nth-child(n)是css3中的一种选择器。
:nth-child(n)选择器用于匹配父元素索引为n的子元素,即选取属于其父元素的第N个子元素,不论元素的类型。
说明:n可以是数字、关键词(Odd 和 even)或公式。
示例1:当n为数字
:nth-child(n)选择器 /* :nth-child(n)选择器用于匹配父元素索引为n的子元素,即选取属于其父元素的第N个子元素,不论元素的类型。 n可以是数字、关键词(Odd 和 even)或公式。 *//* p:nth-child(2) {background: pink;} */第一个段落。
第二个段落。
第三个段落。
第四个段落。
效果图:

示例2:当n为关键词(Odd 和 even)
:nth-child(n)选择器 p:nth-child(odd) {background: pink;}p:nth-child(even) {background: paleturquoise;}第一个段落。
第二个段落。
第三个段落。
第四个段落。
第五个段落。
第六个段落。
第七个段落。
第八个段落。
第九个段落。
手机在线人工冲值查看详情说明:我不知道这个系统还能用到什么地方!他的运作方式是这样的,客户在其他地方比如掏宝购买了 你得卡,然后在你的网站进行冲值,你得有人登陆并看着后台,如果有人冲值,就会刷出记录,手工冲值完毕后,你得点击 [冲值完毕],客户的页面 就会返回 冲值信息!安装:上传所有文件,倒入(sql.txt)mysql数据库,使用myphpadminphplib 777phplib/sys.php 777phplib
0
![]()
第十个段落。
效果图:

示例3:当n为公式
:nth-child(n)选择器 /* 使用公式 (an + b)。描述:表示周期的长度,n 是计数器(从 0 开始),b 是偏移值。 在这里,我们指定了下标是 3 的倍数的所有 p 元素的背景色: */p:nth-child(3n+0){background:pink;}第一个段落。
第二个段落。
第三个段落。
第四个段落。
第五个段落。
第六个段落。
第七个段落。
第八个段落。
第九个段落。
第十个段落。
效果图:

使用公式 (an + b)。描述:表示周期的长度,n 是计数器(从 0 开始),b 是偏移值。
在这里,我们指定了下标是 3 的倍数的所有 p 元素的背景色:
更多编程相关知识,请访问:编程教学!!
以上就是:nth-child(n)的作用是什么的详细内容,更多请关注创想鸟其它相关文章!
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/1617562.html
微信扫一扫
支付宝扫一扫