:empty伪类可精准选中无内容元素，用于隐藏空容器或添加占位样式，需注意空格和换行会使其失效，现代浏览器均支持。
CSS 中确实可以精准选择空元素，这主要依赖于 :empty 伪类。它能帮助开发者选中页面中不包含任何内容（包括文本、子元素、空格等）的元素，从而实现更有针对性的样式控制。
什么是:empty伪类？
:empty 是一个结构化伪类，用于匹配那些内部没有任何内容的元素。这里的“空”指的是元素节点内既没有子元素，也没有文本内容，甚至连换行和空格都不能有。
例如：
/* 被 :empty 选中 */
/* 被 :empty 选中 */
立即学习“前端免费学习笔记（深入）”；
/* 不被选中（包含空格） */
如何使用:empty设置样式？
你可以像使用其他伪类一样，在CSS中直接应用 :empty 来隐藏或标记空元素。
常见用途包括：
- 隐藏无内容的容器，避免布局错位
- 为缺失数据的单元格添加占位样式
- 在表单中提示必填项为空
示例代码：
/* 隐藏完全为空的 div */
div:empty {
display: none;
}
/ 给空的表格单元格添加虚线边框 /
td:empty::after {
content: "—";
color: #999;
}
注意事项与兼容性
使用 :empty 时需注意以下几点：
- 即使元素内只有一个空格或换行符，也不会被视为“空”
- 注释节点（）不影响 :empty 的判断
- 现代浏览器普遍支持 :empty，IE8 及更早版本不支持
如果需要兼容老版本浏览器，可结合JavaScript动态处理空元素。
基本上就这些。合理使用 :empty 能让样式更智能，减少冗余HTML结构，提升页面维护效率。
