css连续选取几个li_CSS高级选择器:nth-child()应用大全

详解CSS中:nth-child的用法

前端的哥们想必都接触过css中一个神奇的玩意，可以轻松选取你想要的标签并给与修改添加样式，是不是很给力，它就是“:nth-child”。

下面我将用几个典型的实例来给大家讲解:nth-child的实际用途：

Tips：还用低版本的IE浏览器的哥们请绕过！

:nth-child(2)选取第几个标签，“2可以是你想要的数字”

.demo01 li:nth-child(2){background:#090}

:nth-child(n+4)选取大于等于4标签，“n”表示从整数，下同

.demo01 li:nth-child(n+4){background:#090}

:nth-child(-n+4)选取小于等于4标签

.demo01 li:nth-child(-n+4){background:#090}

:nth-child(2n)选取偶数标签，2n也可以是even

.demo01 li:nth-child(2n){background:#090}

:nth-child(2n-1)选取奇数标签，2n-1可以是odd

.demo01 li:nth-child(2n-1){background:#090}

:nth-child(3n+1)自定义选取标签，3n+1表示“隔二取一”

.demo01 li:nth-child(3n+1){background:#090}

:first-child选取首个标签

.demo01 li:first-child{background:#090}

:last-child选取最后一个标签

.demo01 li:last-child{background:#090}

:nth-last-child(3)选取倒数第几个标签,3表示选取第3个

css连续选取几个li_CSS高级选择器:nth-child()应用大全相关推荐

CSS的四种基本选择器和四种高级选择器
CSS选择器:就是指定CSS要作用的标签,那个标签的名称就是选择器.意为:选择哪个容器. CSS的选择器分为两大类:基本选择题和扩展选择器. 基本选择器: 标签选择器:针对一类标签 ID选择器:针对某 ...
css的基本选择器和高级选择器
css选择器:指定css要作用的标签,即选择哪个容器,更改它的样式 css选择器主要分为两大类:基本选择器和高级选择器基本选择器: 元素选择器(标签选择器) id选择器类选择器(class选择器) ...
CSS选择器（中）——高级选择器
高级选择器,是区别于常见选择器的概念,是CSS的高级运用,也是作为扩展.总体来说,不使用高级选择器一样能做出十分优雅和绚丽的效果,但是使用高级选择器具有更高的语义化程度,而且能使你的html文本更加干 ...
css层叠引入方式有,前端1-----CSS层叠样式表了解,css的引入方式,三大选择器(标签,类,id),高级选择器...
前端1-----CSS层叠样式表了解,css的引入方式,三大选择器(标签,类,id),高级选择器一丶CSS简介叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTM ...
前端1-----CSS层叠样式表了解,css的引入方式,三大选择器(标签,类,id),高级选择器...
前端1-----CSS层叠样式表了解,css的引入方式,三大选择器(标签,类,id),高级选择器一丶CSS简介叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTM ...
CSS高级选择器+块级元素，行内元素的特点+CSS定位+logo的做法
CSS高级选择器 *是通配符选择器(样式的重置) *{ margin: 0; padding: 0; } 元素的样式的重置,紧贴左上角子选择器:父级>子级后代选择器: 祖先子级作用: 1 ...
jquery学习（3）--高级选择器
自己手写的学习笔记.常规选择器: /****************学习--高级选择器(1)****************/ ---高级选择器:ie7+ 层次选择器: 后代选择器 ul li ...
4、表单和高级选择器
表单和高级选择器 1.什么是表单表单用于收集用户的信息,是浏览器和用户之间沟通的桥梁. 就是你在注册账号时,让你输手机号,输密码那个小框框,明白了吧还不明白? 来给你个图 [外链图片转存失败,源 ...
jQuery之高级选择器
二.jQuery高级选择器针对上次课有点复杂的选择器,或之前没有接触过的选择器. 为什么要反复的讲选择器,这个就是jQuery的一个核心点,在之前js的时候,通过复杂的document.getEle ...

css连续选取几个li_CSS高级选择器:nth-child()应用大全

css连续选取几个li_CSS高级选择器:nth-child()应用大全相关推荐

最新文章

热门文章