在span中隐藏文本

Question

我正在寻找如何将文本("Tag")隐藏到像这样的span中:

<span class="tagged_as">
Tag : 
<a href="product-tag/enfant/" rel="tag">Enfant</a>, 
<a href="product-tag/jeu-prime/" rel="tag">Jeu primé</a>
</span>

我试图删除文本，但我不想改变的东西，一个不做…使用css，我尝试了不同的东西，如font-size 0，但字体的href也改变了…能见度隐藏……不工作…

我不知道如何只选择文本而不选择"a"部分。

Answer 1

我找到了另一种方法来修改转换。您可以在span上使用translateX(-100vw)，在a上使用translateX(100vw)，将父组件推出视窗。有点奇怪，但你永远不会看到它，只要网站垂直滚动.

将font-size更改为0并将其添加回a更可靠(也更优雅)，但如果您不知道文本的font-size或它是可变的，则此解决方案可能会有用。

span {
transform: translateX(-100vw);
display: block;
}
span a {
transform: translateX(100vw);
display: block;
}

<span class="tagged_as">
Tag : 
<a href="product-tag/enfant/" rel="tag">Enfant</a>, 
<a href="product-tag/jeu-prime/" rel="tag">Jeu primé</a>
</span>