id选择器用#定义，针对唯一元素设置样式，如#header{color:white}，对应HTML为<div id="header">；应保持id唯一、避免滥用，优先用class批量设置样式，id适合单个特殊元素及JavaScript操作，命名需语义化，如#mainNav，合理使用可提升结构清晰度与样式精准性。
在CSS中，id选择器通过元素的id属性来选中特定HTML元素，并为其应用样式。由于id在页面中应具有唯一性，因此id选择器常用于定义页面中某个特定元素的外观和布局。
1. id选择器的基本语法
id选择器使用井号（#）开头，后接id名称。例如：
#header {
color: white;
background-color: #333;
padding: 20px;
}
对应HTML代码为：
立即学习“前端免费学习笔记（深入）”；
网站头部
这样，只有id="header"的元素会应用上述样式。
2. id选择器的应用技巧
虽然id选择器功能强大，但使用时需注意以下几点以提升代码可维护性和性能：
- 保持唯一性：一个页面中每个id应只出现一次，重复使用会导致行为不可预测，也违反HTML标准。
- 避免过度使用：id选择器优先级高于类选择器（class），频繁使用会使样式难以覆盖，建议优先使用class，仅在需要唯一标识时用id。
-
结合JavaScript操作：id常用于JavaScript中获取元素（如
document.getElementById("demo")），因此命名应清晰且语义化。 -
命名规范清晰：推荐使用语义化、易读的名称，如
#mainNav、#footer，避免使用#box1这类无意义名称。
3. id与class的选择建议
当多个元素需要相同样式时，使用class更合适；仅有一个元素需要特殊样式时，再考虑使用id。
例如导航菜单项通常有多个，应使用class：
.nav-item {
margin: 0 10px;
color: blue;
}
而页面主标题只有一个，可用id：
#pageTitle {
font-size: 2em;
text-align: center;
}
基本上就这些。合理使用id选择器能让结构更清晰，样式更精准，关键是理解其高优先级和唯一性特点，避免滥用。
