:empty 伪类，表示没有子元素的元素。只计算元素的节点和文本（包括空格）。不考虑注释和运行指令。

例如：

<style>
.item{
  height:20px;
  margin-bottom: 10px;
  background:blue;
}
.item:empty{
  display:none;
}
        </style>
<div class="item">111</div>
<div class="item"> </div>
<div class="item"></div>

效果如下：

为什么:empty不生效？CSS结构性伪类选择器:empty怎么用？-QUI-Notes
前两个都显示了，只有最后一个隐藏成功！第二个中有空格导致:empty失效！

换句话说，:empty生效的前提：标签中一个空格都不能有。