隐藏父元素的内容而不隐藏CSS中的子元素

Question

我有以下HTML：

<span class="parent">
    Hello world
    <a href="#">Link 1</a>
    <a href="#">Link 2</a>
</span>

游戏规则：

• 我想使用CSS
删除“Hello world”字符串
• <a>标签应该仍然可见
• 我无法触及HTML代码
• 没有javascript

因此，解决方案就像在{Hello}字符串周围的display:none元素上设置<span>一样。问题是没有这样的<span>，我无法创建一个。{/ p>

Answer 1

display:none;始终隐藏孩子并覆盖他们的display属性。

您可以尝试使用visibility代替：

.parent { visibility: hidden;}
.parent a { visibility: visible;}

Answer 2

这是不可能的。这就像你手上有一面旗帜，你希望当你坐在一个封闭的盒子里时，有人仍然可以看到你手中的旗帜。实现这一目标的唯一方法是将孩子带出父母，并将他们安置在其他地方。这将是dom-manipulation（javascript）。

编辑： 在深入研究了可见性属性的技术定义和我想出的行为之后，这个答案是不正确的。 jfrej 给出了正确答案。