全部学科

NodeJS全栈

通用技术

redis git docker nginx mysql zookeeper rabbitmq

Web前端

TypeScript vue CSS HTML javascript pinia vite

JAVA后端

maven spring Mytatis SpringMVC SpringBoot java

Python全栈

GO后端

golang gorm gin

小程序首页

📝 1 篇文章 20 道配套习题

CSS选择器专题

专题说明

本专题系统讲解CSS选择器的核心知识，包括基础选择器（标签、类、ID）、属性选择器、组合选择器（后代、子代、兄弟）、伪类与伪元素选择器，以及选择器优先级计算规则。

学习目标

理解各类CSS选择器的语法与使用场景
掌握组合选择器的层级关系选择方法
熟练运用伪类和伪元素选择器
准确计算选择器优先级权重

学习内容

基础选择器：标签选择器、类选择器、ID选择器
属性选择器：属性存在、值匹配、前缀后缀匹配
组合选择器：后代选择器、子选择器、兄弟选择器
伪类选择器：交互状态伪类、结构伪类
伪元素选择器：::before、::after
选择器优先级与继承

学习建议

先掌握基础选择器的语法差异，再学习组合选择器
重点理解优先级权重计算方法，多做计算练习
伪类选择器注意区分交互状态类和结构类
实际编码中合理选择选择器类型，避免过度嵌套

📝 发现内容有误？点击此处直接编辑

📝 配套习题（20 题）

1

单选题

CSS选择器的主要作用是什么？

A

定义CSS属性值

B

选择要应用样式的HTML元素

C

创建新的HTML元素

D

设置元素的显示顺序

2

单选题

以下哪个是标签选择器（元素选择器）？

A

.container

B

#header

C

div

D

[type="text"]

3

判断题

标签选择器会选择文档中所有对应的HTML元素，无法单独选择某个特定的元素。

A

对

B

错

4

单选题

CSS类选择器的语法是以什么符号开头？

A

#

B

.

C

@

D

*

5

判断题

一个HTML元素可以同时拥有多个class类名，用空格分隔，如 <div class="box container active">。

A

对

B

错

6

单选题

CSS ID选择器的语法是以什么符号开头？

A

#

B

.

C

:

D

$

7

判断题

HTML页面中，同一个ID值只能在一个元素上使用，具有唯一性。

A

对

B

错

8

单选题

ID选择器和类选择器的主要区别是什么？

A

ID选择器优先级更低

B

ID选择器可以重复使用

C

ID选择器优先级更高，且ID在页面中唯一

D

类选择器只能用于div元素

9

填空题

常用的交互状态伪类选择器：

鼠标悬停状态使用 ______
链接被点击激活状态使用 _______
元素获得焦点状态使用 ______

10

多选题

以下哪些是CSS结构伪类选择器？

A

:first-child

B

:last-child

C

:nth-child(n)

D

:hover

E

:not(selector)

11

单选题

:nth-child(2n) 选择器会选择哪些元素？

A

所有奇数位置的子元素

B

所有偶数位置的子元素

C

第2个子元素

D

有2个子元素的父元素

12

判断题

使用::before或::after伪元素时，必须设置content属性，否则伪元素不会显示。

A

对

B

错

13

单选题

CSS后代选择器的语法格式是什么？

A

选择器之间用 > 分隔

B

选择器之间用空格分隔

C

选择器之间用 + 分隔

D

选择器之间用 ~ 分隔

14

单选题

div > p 选择器会选择哪些元素？

A

div元素内的所有p元素

B

div元素的直接子元素p

C

div元素后面紧邻的p元素

D

div元素后面的所有p兄弟元素

15

单选题

以下哪个是CSS属性选择器？

A

.class

B

#id

C

[type="text"]

D

:hover

16

填空题

属性选择器的匹配方式：

选择有指定属性的元素：__________
选择属性值完全匹配的元素：________________________
选择属性值包含指定词的元素：________________________

17

单选题

[href^="https"] 属性选择器会选择哪些元素？

A

href属性值等于"https"的元素

B

href属性值以"https"开头的元素

C

href属性值包含"https"的元素

D

href属性值以"https"结尾的元素

18

单选题

选择器 #header .nav li a:hover 的优先级权重是多少？

A

122

B

121

C

112

D

111

19

单选题

当多个选择器设置同一元素的同一属性产生冲突时，以下哪种情况优先级最高？

A

ID选择器设置的样式

B

内联style属性设置的样式

C

带!important声明的样式

D

最后在CSS文件中出现的样式规则

20

多选题

以下关于CSS选择器的说法，正确的有？

A

标签选择器可以选择所有同名HTML元素

B

类选择器以.开头，可以在多个元素上使用

C

ID选择器以#开头，在页面中应唯一使用

D

属性选择器可以根据元素的属性匹配元素

E

伪类选择器用于选择元素的特定状态

📝 发现内容有误？点击此处直接编辑

想查看更多习题和详细解析？

小程序提供完整的题库和详细解析

长按或扫描二维码，立即体验