在线客服
扫描二维码
下载博学谷APP
扫描二维码
关注博学谷微信公众号
CSS 选择器的种类有哪些？怎么用？CSS 选择器的种类有标签选择器、类选择器、层级选择器(后代选择器)、id选择器、组选择器、伪类选择器，作为程序员应该具备根据不同的场景选择适合的CSS选择器。
CSS 选择器学习目标：熟悉掌握CSS 选择器的种类。
1、CSS 选择器是什么？
CSS 选择器是用来选择标签的，选出来以后给标签加样式。
2、CSS 选择器的种类有哪些？
六种CSS 选择器：标签选择器、类选择器、层级选择器(后代选择器)、id选择器、组选择器、伪类选择器
3、标签选择器
根据标签来选择标签，以标签开头此种选择器影响范围大一般用来做一些通用设置。
标签选择器示例代码：
4、类选择器
根据类名来选择标签，以 . 开头, 一个类选择器可应用于多个标签上，一个标签上也可以使用多个类选择器，多个类选择器需要使用空格分割，应用灵活，可复用，是CSS中应用最多的一种选择器。
类选择器示例代码：
5、层级选择器(后代选择器)
根据层级关系选择后代标签，以选择器1 选择器2开头，主要应用在标签嵌套的结构中减少命名。
层级选择器示例代码：
注意点: 这个层级关系不一定是父子关系，也有可能是祖孙关系，只要有后代关系都适用于这个层级选择器
6、 id选择器
根据id选择标签，以#开头, 元素的id名称不能重复，所以id选择器只能对应于页面上一个元素，不能复用，id名一般给程序使用，所以不推荐使用id作为选择器。
id选择器示例代码：
注意点: 虽然给其它标签设置id=“box”也可以设置样式，但是不推荐这样做，因为id是唯一的，以后js通过id只能获取一个唯一的标签对象。
7、组选择器
根据组合的选择器选择不同的标签，以 , 分割开, 如果有公共的样式设置，可以使用组选择器。
组选择器示例代码：
8、伪类选择器
用于向选择器添加特殊的效果, 以 : 分割开, 当用户和网站交互的时候改变显示效果可以使用伪类选择器
伪类选择器示例代码：
CSS 选择器总结：CSS 选择器就是用来选择标签设置样式的；常用的 CSS 选择器有六种分别是:标签选择器、类选择器、层级选择器(后代选择器)、id选择器、组选择器、伪类选择器。
— 申请免费试学名额 —
在职想转行提升，担心学不会？根据个人情况规划学习路线，闯关式自适应学习模式保证学习效果
讲师一对一辅导，在线答疑解惑，指导就业！
上一篇：
CSS显示特性display属性的使用介绍
下一篇：
CSS 元素溢出是什么？怎么使用？
相关推荐 更多
好用的Python编辑器有哪些？Python编辑器推荐
好用的Python编辑器有哪些？Python编辑器推荐：Sublime Text、Sublime Text、Atom、PyCharm、Vim、clipse with PyDev、Emacs、Komodo Edit、Wing、PyScripter、The Eric Python IDE、Interactive Editor for Python等。
10381
2019-09-24 10:51:46
Python字符串常用技巧整理
相信在大家日常的文本处理工作中，都免不了要使用字符串。众所周知，使用Python处理字符串，十分的便捷和高效。本文整理了六大处理字符串的技巧，分别是字符串的切片和相乘，字符串中去掉一些字符，字符串的连接和合并，字符串的分割，字符串的开头和结尾的处理，字符串的查找和匹配。想要玩转Python字符串，就和我一起来看看吧！
8000
2019-12-02 16:44:31
Python入门简单吗？怎么学Python？
Python在机器学习人工智能领域非常流行，可以说是算法工程师的标配编程语言。Python语言广泛应用在web开发、大数据开发、人工智能开发、机器学习、后端开发等领域之中，近几年Python语言的趋势不断上升发展前景好。
6480
2020-09-24 14:54:24
为什么说Python入门容易精通难？
Python应用领域广泛，没有具体的学习方向学完基础知识之后会很迷茫，应先确定好学习方向，按照这个学习方向建立学习路径规划。Python 非常适合初学者上手，相比较于其他主流编程语言其语言环境更接近自然语言，具备良好的可读性。
6441
2021-04-01 16:57:38
Python在线学习可以吗？靠不靠谱？
因为新冠疫情肆虐，在线学习成为了一种新的学西方式，选择在线学习Python有很多优势。未来互联网和人工智能密不可分，Python编程已逐渐成为工作场所必需的基本技能。学习Python可以提高办公效率增加职场竞争优势。
7263
2021-11-26 11:04:55
