类名选择器是不是css3新增的

这篇文章主要讲解了“类名选择器是不是css3新增的”，文中的讲解内容简单清晰，易于学习与理解，下面请大家跟着小编的思路慢慢深入，一起来研究和学习“类名选择器是不是css3新增的”吧！

类名选择器不是css3新增才有的，类名选择器用于选取带有指定类的元素，语法为“.class{css代码;}”；类名选择器是在css3之前就已经开始使用了，并不是css3新增的，css3新增的选择器有属性选择器、结构伪类选择器等。

本教程操作环境：windows10系统、CSS3&&HTML5版本、Dell G3电脑。

类选择器

用class属性调用class类

举例：

 <p class="one">类选择器</p>

 .one {
       color: yellow;
        }

这里的p标签类名叫做one，css给他添加样式的时候用的.+one（他的类名）选择的他，这种就是类选择器。

扩展知识：css3新增选择器

属性选择器

结构伪类选择器

ul li:first-child { } （选择ul里面的第一个孩子小li）
ul li:last-child { } （选择ul里面的最后一个孩子小li）
ul li:nth-child(2) { } （选择ul里面的第二个孩子小li）
ul li:nth-child(6) { } （选择ul里面的第六个孩子小li）
ul li:nth-child(even/2n) { } （把所有的偶数 even的孩子选出来）
ul li:nth-child(odd/2n+1) { } （把所有的奇数 odd的孩子选出来）
ol li:nth-child(n) { } （从0开始每次加1 往后面计算必须是n 不能是其他的字母选择了所有的孩子
ul li:nth-child(n+5) { } (选择从第五个孩子开始)
ul li:nth-child(-n+5) { } (选择从第五个孩子开始往前数)
ul li:first-of-type { } （第一个孩子）
ul li:last-of-type { } （最后一个孩子）
ul li:nth-of-type(even) { } （偶数孩子）
section div:nth-child(1) { } （nth-child 会把所有的盒子都排列序号执行的时候首先看 :nth-child(1) 之后回去看前面 div ）
section div:nth-of-type(1) { } （nth-of-type 会把指定元素的盒子排列序号；执行的时候首先看 div指定的元素之后回去看 :nth-of-type(1) 第几个孩子）