DigitalOcean 为您的旅程的每个阶段提供云产品。 立即开始使用 $200 的免费信用额度！
:blank 伪类建立在 :empty 伪类之上。 与 :empty 一样，:blank 将选择完全不包含任何内容或仅包含 HTML 注释的元素。 但是，:blank 还会选择包含空格的元素，而 :empty 不会。
p:blank {
display: none;
}p:blank 将选择这些段落，就像 p:empty 一样
<p></p>
<p><!-- nothing but a comment--></p>它还会选择这些段落，而 p:empty 不会
<p> </p>
<p>
<!--a comment and some whitespace-->
</p>在撰写本文时，:blank 是 CSS 选择器级别 4 草案的一部分，并且不受任何浏览器支持。 Mozilla 支持其自己的 :blank 版本，但使用不同的供应商前缀名称：:-moz-only-whitespace。 以下演示包括 Mozilla 的版本，目前只在 Mozilla 浏览器中有效。
查看 Pen :blank and :-moz-only-whitespace by mariemosley (@mariemosley) on CodePen.
相关
更多信息
浏览器支持
| Chrome | Safari | Firefox | Opera | IE | Android | iOS |
|---|---|---|---|---|---|---|
| 否 | 否 | 作为 :-moz-only-whitespace | 否 | 否 | 否 | 否 |
希望这不会从草案中被删除。我遇到过几个这样的情况，这些情况非常有用，我很高兴它以某种形式得到解决！
这会是解决空问题的一个快速方法吗？
由 WordPress 的 wautop 创建？
p 标签
我真的希望这能进入最终的 CSS 选择器级别 4 规范，因为这将非常有用，而不是必须使用 JS。
在
ng-if/ng-repeat的 AngularJS 注释的情况下，这将非常有用，因为这些注释是绝对必要的 - 你不能删除它们，它们有默认的缩进和换行符。一般来说，AngularJS 注释由于几个原因让人头疼：DOM 中的视觉混乱以及被许多 CSS 选择器（特别是
:first-child和:last-child）视为 DOM 节点。对于任何寻找快速解决方法的人（我使用 Angular 时使用过这个）
在你的容器中放置一个 div，并使用 :only-child 作为目标。
谢谢！！它解决了困扰我很久的一个大问题。
如果你想对一个空的部分添加“display: none”，这并不真正有帮助。我们需要类似 :blank 的东西来解决这种情况。
这只会选择 isEmpty div，对吧？这如何帮助样式化容器？
文章中的演示很好地说明了它在选择相同 HTML 元素的特定空白内容实例时如何有用。它是一个区分器，根据你的用例，这可能非常有用。
今天我发现自己需要这个。基本上，我在左侧有幻灯片，在右侧有笔记，它们被一个弹性容器隔开。如果笔记 div 为空，它实际上不应该显示（display: none;）。但是，由于它确实包含一些空格，因此像 :empty 这样的东西不起作用。
我们现在将通过编写更多后端代码来解决它，但如果像这样的东西可以通过 CSS 解决，那将使事情变得容易很多。
这个功能真的很有用也很酷！
在 CSS 选择器级别 4 中，
:empty被重新定义，因此它也匹配空格，而:blank仅选择空的文本区域和输入框。参考：https://mdn.org.cn/en-US/docs/Web/CSS/:blank