css - 隐藏元素中的文本节点，但不隐藏子节点

Question

我在 CSS 方面遇到了一些麻烦，似乎找不到解决方案。我有这个 HTML

<div id="closelink">
  <a href="">Close</a>
  Click to close
</div>

现在我只想隐藏文本 «Click to close»，既不隐藏 div，也不隐藏其中的链接。

这可以做到吗？

Answer 1

可以在子元素上覆盖 visibility 属性，因此您可以这样做:

#closelink {
  visibility: collapse;
}

#closelink a {
  visibility: visible;
}

<div id="closelink">
  <a href="">Close</a> Click to close
</div>