在线客服
扫描二维码
下载博学谷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容器可以存储哪些类型数据?一般可以储存四种数据类型，即list（列表）、tuple(元组)、set(集合)和dict(字典)。下面为大家详细介绍分析Python容器的存储数据类型，这些也是大家在学习Python编程基础所必须掌握的知识点，还不了解的小伙伴赶紧接着看下去吧！
12512
2019-10-23 16:17:39
Python飞机大战实战项目案例
都说实践是检验知识掌握程度的最好测试。随着Python学习者的增长，越来越多的零基础入门课程让人眼花缭乱。虽然说基础理论的学习十分重要，但是如果仅仅只学习理论知识，也是远远不够的。飞机大战的项目实战可以说是python基础入门的最好课程之一，下面我们一起来看看博学谷上的Python飞机大战项目实战案例。
7706
2020-03-09 01:41:20
Python学习周期 学习Python要多久？
学习Python编程需要多长时间？首先我们需要明确一点，在互联网技术领域，技术始终在不断的迭代升级，只要进入IT行业就要时刻保持学习的状态，才能不被技术进步的车轮碾压。我们目前讨论的Python学习周期，主要是从应用层面，学习到一定程度，能达到就业水平的整个学习周期。
8291
2020-05-15 18:16:57
一文解读Python变量类型
所有具体的值都可以通过变量来代替，但是对于不同的“值”，在系统内存中所占用的空间是不同的，所以在部分编程语言中，将变量分为不同的种类以节约数据存储空间。本篇文章主要和大家分享在Python编程语言中变量类型。
7333
2020-06-08 16:21:18
Python基础进阶需要掌握哪些知识点？
Python将是每个程序员的标配，有编程基础再掌握Python语言对于日后的升职加薪更有利。Python语言简洁利于理解，语法上相对容易能够让开发者更专注于业务逻辑的实现。学完Python可以从事web开发，爬虫开发、云计算，自动化运维，人工智能、桌面软件等多方面工作，目前市场需求很多发展机会很多。
6126
2020-08-24 16:59:28
