【CSS】什么是 CSS 中的交集选择器

CSS 的选择器有很多，常用的有 元素选择器、id 选择器、class 选择器、后代选择器、子代选择器、并集选择器、交集选择器、伪类选择器、通配符选择器 等。

本篇博客说的是交集选择器，详细内容如下

一：交集选择器

交集选择器由两个选择器构成，其中第一个为标签选择器，第二个为 class 选择器，两个选择器之间不能有空格。

说明
交集选择器你可以理解为"并且"的意思，或者"既…又…"的意思。在实际开发中，用的相对较少，而且也不推荐使用，本篇博客仅做了解即可。

1：举例说明

HTML 代码如下

	<div class="myClass">积一时之跬步，臻千里之遥程</div>
	<p class="myClass">学习与坐禅相似，须有一颗恒心</p>

CSS 代码如下

	.myClass {color: blue;}

这段代码运行后，div 和 p 的文本颜色都会变成蓝色，浏览器运行效果如下

题目要求
假如现在我们用交集选择器，只让 div 的文本颜色设置为蓝色，而 p 元素的文本颜色不变，如何实现呢 ？

分析
按照交集选择器的写法，第一个选择器是标签选择器，第二个是 class 选择器，中间不能有空格，所以

修改后的 CSS 代码如下

	div.myClass {color: blue;}

浏览器运行效果如下

---

结束语

如果这篇博客有幸帮到了您，欢迎点击下方链接，和更多志同道合的伙伴一起交流，一起进步。