在线客服
扫描二维码
下载博学谷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吗?不一定，如果大家会C/C++也可以不学Python，但是使用Python的脚本语言更加简单，所以为什么不使用更加轻松的编程语言呢？而且Python也是科学计算和数据分析的重要工具，学人工智能先学Python，也可以方便初学者。博学谷为此专门开设了Python+人工智能在线就业班课程，有兴趣学习人工智能的同学可以了解一下该课程。
7833
2019-08-21 14:41:48
6个技巧帮你提高Python运行效率
随着国内对人工智能领域发展的大力支持，Python编程语言成为国内使用增长率的最大的编程语言。越来越多的人加入Python的学习行列，企业对Python的使用也越来越普遍。Python能够让你在端时间内通过少量代码，实现大量的操作。这里小编整理了6个Python编程技巧，帮你提高Python的运行效率。
7636
2019-12-05 18:51:03
Python数据分析可视化教程学习
随着数据分析与数据挖掘行业的日益火爆，Python数据分析可视化教程也成为了许多人提升职业竞争力的必修课。本文将详细为大家介绍Python数据分析可视化教程的具体内容，全文会围绕着为什么学？学什么？学了有什么用？这几个问题展开，让大家全面了解该教程适不适合自己学习。如果对数据分析感兴趣就接着看下去吧！
7500
2020-04-03 15:54:58
Linux系统如何安装Python？新手教程
新手入门Python的第一步就是要在你的计算机上安装好Python。有些人可能要问了，Linux系统如何安装Python？本文为你准备了一份新手安装Python的教程，几乎是手把手教你如何操作，你只要尽量照着下面的教程说明，就能成功地在Linux系统下成功安装Python~
6680
2020-04-27 17:14:04
作为996社畜，如何自学Python？
作为996社畜，应该如何自学Python？确定好目标，选择合适的内容，制定计划，多多练习，多多分享，制定最适合自己的计划，然后按部就班的实施起来。如果你能坚持这么做，一定可以学好Python。
5626
2021-07-20 16:03:47
