【CSS 教程系列第 5 篇】什么是 CSS 中的元素选择器（标签选择器）

这是【CSS 教程系列第 5 篇】，如果觉得有用的话，欢迎关注专栏。

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

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

一：元素选择器

CSS 中的元素选择器是指用 HTML 元素名称作为选择器，按元素名称分类，为页面中某一类元素指定统一的 CSS 样式。

通俗说就是选中相同的元素，然后给相同的元素定义同一个 CSS 样式。

二：语法

如下图所示

div 是我们的元素符号，color 和 font-size 代表属性，red 和 20px 代表属性值。

这行代码的意思是选中页面中所有的 div 元素，然后定义它们的文本颜色为红色，字体大小为 20 像素。

三：举例说明

如下代码所示

	<div>雄心志四海，万里望风尘</div>
	<p>雄心志四海，万里望风尘</p>
	<h4>雄心志四海，万里望风尘</h4>
	<div>雄心志四海，万里望风尘</div>

浏览器运行效果如下所示

现在需要将所有 div 元素的文本颜色改为红色，字体大小设置为 16 像素，我们在 CSS 中加上一行代码，如下所示

div  { color: red; font-size: 16px; }

刷新浏览器后，效果如下图所示

可以看到，只有 div 元素的文本颜色和字体大小发生了改变，而 p 元素与 h4 元素未发生改变。因为元素选择器只选中指定的相同元素。

四：优缺点

• 优点：能快速为页面中同类型的元素设置统一样式。
• 缺点：但这也是它的缺点，因为它不能设计差异化样式。

称不得上缺点吧，但找不出合适的词来表达，因为这就是元素选择器被设计出来的用法而已。

你的问题得到解决了吗？欢迎在评论区留言。

赠人玫瑰，手有余香，如果觉得文章不错，希望可以给个一键三连，感谢。

---

结束语

技术是一点一点积累的，大神也不是一天就可以达到的。原地不动就是退步，所以每天进步一点点。

最后，附上一句格言："好学若饥，谦卑若愚"，望共勉。