在线客服
扫描二维码
下载博学谷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 元素溢出是什么？怎么使用？
相关推荐 更多
HTTP与HTTPS有什么区别和联系？
HTTP与HTTPS有什么区别和联系？简单来说，HTTPS就是HTTP的加强版，这样子是不是好理解多了？当然啦，仔细分析下来，HTTP与HTTPS的区别和联系不止于此，下面是详细分析。
6953
2019-07-30 15:57:58
《编程小白的第一本Python入门书》读书笔记
对于编程零基础初学者来讲，Python入门选择看什么样的书是很重要的。第一本Pthon入门书的内容要精简，不然新手学了很久，都还在死磕基础知识。书的难度也不能太高，不然缺乏基础的学习者会看不懂，从而失去学习兴趣。因此在这里，小编要向大家推荐，一本最适合零基础学习者的书——《编程小白的第一本Pthon入门书》。
6608
2019-08-23 18:26:39
Python容器有哪些？都有什么作用？
Python容器有哪些？都有什么作用？相信对Python容器有一定了解的朋友都应该知道，Python常用的容器一般有元祖、集合、字典、列表四种。而这些Python容器的作用概括起来，就是统一存储、管理一系列数据。本文将带大家一个个分析Python容器的具体内容，想要把Python容器知识点梳理一遍的朋友，可以一起来看看。
4857
2020-01-10 17:17:11
学习python技术难吗？
Python语言的就业前景会非常好。相对于其他来说，它语法简单易读，消除了初学者对于“编程”这一行为的恐惧，让越来越多的非科班有信心开始通过编写简单的程序，究竟学习python技术难吗？关键在于你多注意小编这几点。
4760
2020-05-04 16:49:13
如何用Django框架搭建博客系统？
Django目前已经成为Web开发者的首选框架， 作为一款开放源代码的PythonWeb 应用框架，Django采用了MVT 软件设计模式。使用Django架构，我们不需要多少代码就可以写出一个完整的应用程序。那么，如何用Django框架搭建博客系统呢？下面将为大家分享一个实战教程，手把手从零开始教大家如何搭建博客系统。
4186
2020-06-18 14:58:27
热门文章
- 前端是什么
- 前端开发的工作职责
- 前端开发需要会什么？先掌握这三大核心关键技术
- 前端开发的工作方向有哪些？
- 简历加分-4步写出HR想要的简历
- 程序员如何突击面试？两大招带你拿下面试官
- 程序员面试技巧
- 架构师的厉害之处竟然是这……
- 架构师书籍推荐
- 懂了这些，才能成为架构师 查看更多
扫描二维码，了解更多信息
