ID选择器必须以#开头，这是CSS语法硬性要求而非约定；ID值不能以数字开头且大小写敏感，含特殊字符需转义；优先级高但不可复用，现代开发中应慎用。
ID选择器就是用 # 加 ID 名来匹配元素，比如 #header 只会选中 id="header" 的那个唯一元素。
为什么必须用 # 开头？
CSS 规范里，# 是 ID 选择器的强制前缀，没它浏览器直接忽略整条规则。不是约定，是语法硬性要求。
-
.nav是类选择器，nav是标签选择器，只有#nav才是 ID 选择器 - ID 值本身不能以数字开头（如
id="1box"合法但#1box在 CSS 中无效），得写成#box1或加转义#\31 box - ID 包含连字符、下划线、字母数字都 OK，但空格、点、冒号等特殊字符必须用反斜杠转义，比如
#my-id要写成#my\-id
id 属性和 # 选择器必须完全一致
大小写敏感，拼写差一个字母就失效。HTML 中写了 id="UserModal"，CSS 就得写 #UserModal，写成 #usermodal 或 #userModal 都不生效。
- 检查 DOM：右键“检查”，确认元素上真实的
id值（注意有没有前后空格） - 避免动态生成 ID 时多出空格或换行，比如 JS 拼接
id=`${prefix}-${name} `末尾多了空格，#foo-bar这种选择器永远不匹配 - Vue/React 中用
v-bind:id或id={id}时，确保变量值干净，建议加.trim()
ID 选择器优先级高，但别滥用
#sidebar 的优先级远高于 .container .sidebar，甚至高于大多数内联 style 以外的规则。这既是优势也是隐患。
立即学习“前端免费学习笔记（深入）”；
- 改一个
#main-content样式，可能意外覆盖掉组件库里精心写的.card .content规则 - ID 选择器无法复用，每个页面只能有一个
#login-form，想套用同样样式到另一个表单就得复制规则或改用 class - 现代 CSS 架构（如 BEM）基本回避 ID 选择器，调试时搜
#很难定位样式来源，尤其在大型项目里
ID 选择器真正该用的地方其实很窄：锚点跳转关联样式、JS 快速获取单个元素后临时加样式、或者极简静态页里控制关键区块。复杂页面里，它容易成为样式冲突和维护负担的起点。
