在线客服
扫描二维码
下载博学谷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的身影。Python语言自身的优点吸引者初学者，然而不少从零开始时学Python的小伙伴难免在入门时产生迷茫感，这里小编整理了一份从零开始学Python必看入门指导。
7756
2019-07-22 15:10:47
Python基础知识之变量类型
Python中的变量不需要声明，每个变量在使用之前必须赋值，变量赋值之后，该变量才被创建。而且Python中的变量不需要指定类型。变量类型是大家在学习Python时必须要掌握的基础知识，本文将从变量、赋值、标准和转换四大方面为大家梳理一下变量类型的知识点内容。
8528
2019-07-26 12:57:05
python培训多少钱？值不值得花钱学习？
什么样的人合适学习Python？询问周围的朋友python培训多少钱？值不值得花钱学习？他们总能发出对Python的意见和建议，让你在这些声音中摇摆不定，说实在的，他们又知多少呢，最后还是要看你自己。所以想学好python，关键还是看三点。
6814
2020-01-10 15:06:01
开发中Django和Flask框架的区别是什么？
Django和Flask框架的区别是什么？Python中Django框架和Flask框架都是比较常见的，在开发应用系统时，使用框架可以提升开发效率，让应用开发更加规范、拓展性更强，程序员把更多的精力放在业务逻辑的实现上，而不是重复、而复杂的基础环境上。
6093
2020-08-24 16:15:31
学Python编程能做什么工作？从事什么岗位？
随着人工智能发展，学习python语言的人员有更多的岗位机会，python从事的职业广泛，从游戏到AI人工智能能都可以用Python实现。除了编程，各种岗位的人都应该学python编程，python编程会大大的提高工作效率。
5712
2020-12-15 13:59:06
