免费模板网标签tags 更多...
                您的位置:首页 > div+css > nth-of-type(an+b) 伪类标签

                nth-of-type(an+b) 伪类标签

                时间:2018-10-25 来源:网上收集 作者:Tony 阅读次数 tagscss伪类

                分享到:

                nth-of-type(an+b) 伪类标签使用说明介绍

                1.jpg

                :nth-of-type(n) (n 可以是数字、关键词或公式)

                匹配同类型中的第n个同级相同元素名元素E

                要使该属性生效,E元素必须是某个元素的子元素,E的父元素最高是html,即E可以是html的子元素,也就是说E可以是body 该选择符总是能命中父元素的第n个为E的子元素,不论第n个子元素是否为E

                div p:nth-of-type(3){color:red},在div众多各种各样的标签中,多个p标签中,第3个p标签颜色为红色(前面有2个p标签)

                :nth-of-type(an+b),位置指定

                p:nth-of-type(3){color:red},第3个p标签颜色是红色。
                <style>
                    p:nth-of-type(2) { background: #f00;}
                </style>
                <body>
                    <h5>标签1</h5>
                    <p>标签2,第一个p</p>
                    <p>标签3,第二个p,我是红色,因为我是body标签的第二个p元素</p>
                    <div>
                        <h5>div中的标签1</h5>
                        <div>div中的标签2</div>
                        <p>div中的标签3,第一个p</p>
                        <p>div中的标签4,第二个p,我是红色,因为我是div标签的第2个p元素</p>
                    </div>
                </body>

                :nth-of-type(an+b) 伪类,表示一个父标签中的第 an+b 个同级且元素名相同的元素(n 可以是数字、关键词或公式)

                在同一个父级标签中,该元素前面有 an+b-1 个同级且元素名相同的元素(n 可以是数字、关键词或公式)

                <style>
                    p:nth-of-type(3n+1) {color: #f00;}
                    p:nth-of-type(3n) {color: #690;}
                    div p:nth-of-type(3n+1) {color: #00f;}
                </style>
                <body>
                	<p>标签1,第一个p,我是红色,我是body标签第 3n+1=(3*0+1)=1 个p元素</p>
                	<h5>标签2,h5标签</h5>
                	<div>标签3,div标签</div>
                	<p>标签4,第二个p</p>
                	<p>标签5,第三个p,我是绿色,我是body标签第 3n=(3*1)=3 个p元素</p>
                	<div>
                		<h5>标签1,h5标签</h5>
                		<p>标签2,第一个p,我是蓝色,因为我是div标签第 3n+1=(3*0+1)=1 个p元素</p>
                		<div>标签3,div标签</div>
                		<p>标签4,第二个p</p>
                		<p>标签5,第三个p,我是绿色,因为我是div标签第 3n=(3*1)=3 个p元素</p>
                	</div>
                </body>

                快去试试怎么用吧

                本文地址:http://www.crdlvtt.tw/bjrm/h3055.html

                猜你喜欢
                栏目推荐
                模板推荐

                Copyright:2014-2019 www.freemoban.com Corporation,All Rights Reserved 免费模板网 版权所有 鄂ICP备19005084号

                免责声明:本站部分资源来自互联网收集,版权归原创者所有,如果侵犯了你的权益,请通知我们,我们会及时删除侵权内容,谢谢合作!

                建站咨询QQ
                十二生肖66期一字解码开什么 武鸣县| 桂林市| 英德市| 正定县| 什邡市| 西青区| 丽水市| 石屏县| 肇州县| 宿松县| 汶上县| 义马市| 德庆县| 临颍县| 镇江市| 常山县| 大庆市| 科技| 嘉鱼县| 全椒县| 岳普湖县| 报价| 逊克县| 鲁甸县| 乐陵市| 石渠县| http://www.eyu988.co 阜南县| 博兴县| 万盛区| 克山县| 吉首市| 黄骅市| 霍州市| 临安市| 阿城市| 夹江县| 海晏县| 苗栗市| 金山区| 牙克石市| 双江| 和政县| 五峰| 灵川县| 泰顺县| 安国市| 南木林县| 许昌市| 南和县| 嵩明县| 抚宁县| 揭东县| 柯坪县| 绍兴市| 靖西县| http://urulzr.cn 潢川县| 改则县| 阳原县| 许昌市| 那曲县| 承德县| 涟水县| 通化市| 株洲市| 兖州市| 黄梅县| 永福县| 揭阳市| 蒙城县| 木兰县| 班戈县| 吉水县| 吴江市| 囊谦县| 邵东县| 泽州县| 衡阳市| 翼城县| 海口市| 白沙| 临海市| 东莞市| 贵南县| 阳原县| 安泽县| 大宁县| 平遥县| 清流县| 阜南县| http://cjclid.com 讷河市| 寿宁县| 陈巴尔虎旗| 隆安县| 芦山县| 新化县| 金寨县| 珲春市| 泾川县| 临潭县| 平顶山市| 墨江| 会昌县| 任丘市| 河南省| 吉木乃县| 龙南县| 白玉县| 象山县| 城口县| 都安| 平顺县| 乐亭县| 新泰市| 肇庆市| 武城县| 电白县| 平顶山市| 衡阳市| http://www.rjpqvb.co 寿光市| 新昌县| 金坛市| 安达市| 福贡县| 嘉禾县| 北安市| 玉门市| 三亚市| 冀州市| 普安县| 霍邱县| 和田县| 文安县| 株洲县| 江油市| 彰化市| 潜山县| 渝中区| 陵水| 合水县| 合阳县| 平安县| 错那县| 仲巴县| 南华县| 井研县| 江安县| 德州市| http://www.jflxje.com.cn 南平市| 双辽市| 巨鹿县| 荣昌县| 二连浩特市| 岳普湖县| 高要市| 深州市| 合山市| 曲沃县| 濮阳县| 乌鲁木齐市| 泰安市| 桃园市| 隆化县| 会昌县| 雷州市| 绥阳县| 斗六市| 兴和县| 砀山县| 新安县| 当阳市| 海口市| 潮州市| 德兴市| 桐乡市| 唐海县| http://66omkv.com 九龙坡区| 蚌埠市| 新晃| 玉林市| 磐石市| 甘孜县| 襄汾县| 扶绥县| 藁城市| 桐柏县| 平塘县| 冀州市| 黄石市| 岑巩县| 简阳市| 石阡县| 靖西县|