【CSS】什么是 CSS 中的 id 选择器

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

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

一：id 选择器

我们可以为元素设置一个 id 属性，然后针对设置了这个 id 的元素定义 CSS 样式，这就是 id 选择器。

注意：在同一页面中，不允许出现两个相同的 id ，id 具有唯一性，就好比没有两个相同的身份证号码。

二：语法

对于 id 选择器，我们必须在 id 名前面加上前缀符号 # ，然后后面紧跟 id 名，表示这是一个 id 选择器，不加 # 前缀该选择器就是无效的。基本语法格式如下图所示

然后在需要指定样式的元素加上 id 属性，属性值是你指定的 id 名。

三：举例说明

如下代码所示

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

浏览器运行效果如下所示

我希望第三个 div 的文本颜色为红色，字体大小为 18 像素，这时就可以使用 id 选择器，HTML 代码如下

	<div>雄心志四海，万里望风尘</div>
	<div>雄心志四海，万里望风尘</div>
	<div id="thirdRow">雄心志四海，万里望风尘</div>

CSS 代码如下

	#thirdRow {color: red;font-size: 18px;}

浏览器运行效果如下

#thirdRow {color: red;font-size: 18px;} 这行代码的意思是选中 id 为 thirdRow 的元素，然后设置该元素的文本颜色为红色，字体大小为 18 像素。

---

结束语

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