如何使用 CSS 隐藏元素中的文本节点，同时保持其他元素可见？

定位元素内的文本节点

CSS 允许您设置特定元素及其子元素的样式，但是如果您想隐藏或操作元素内的文本同时使周围的元素可见？考虑以下 HTML：

<div>
<p>目标是隐藏文本“单击关闭”而不影响 div 或其内的链接。</p>
<p><strong>利用可见性</strong></p>
<p>visibility 属性可以隐藏或显示元素。但是，与显示属性不同的是，可以为子元素单独设置可见性。这允许您有选择地隐藏文本节点：</p>
<pre class="brush:php;toolbar:false">#closelink {
  visibility: collapse;
}

#closelink a {
  visibility: visible;
}

在此示例中，div (#closelink) 的可见性“折叠”，隐藏其整个内容，包括文本节点。但是，div (a) 中链接的可见性设置为“可见”，从而覆盖父级的可见性并显示链接及其包含的文本。

此技术有效隐藏文本节点，同时保留周围的元素，为 CSS 中的细粒度内容操作提供快速、简单的解决方案。