Javascript 使用CSS或JS隐藏a href标记内的文本

我有以下格式的列表：

<ul>
    <li><a href="link">Part 1</a></li>
    <li><a href="link">Part 2</a></li>
    <li><a href="link">Part 3</a></li>
</ul>

我正在使用css

：before

显示内容，而不是

a href

标记中的文本，我想隐藏文本。我只想隐藏第1部分、第2部分和第3部分的文本，并在那里留下一个href标记

---

如果我使用

显示：无然后所有内容都被隐藏了，我怎么能将文本隐藏在href标记中呢？
通常通过负缩进来完成，这对搜索引擎优化是友好的；与
可见性相对：隐藏或
显示：无

display: inline-block;
text-indent: -999px;

但是由于您需要在相同元素上使用
：before
pseudo，因此上述操作将无法正常工作，

因此，字体大小可能是一个更好的解决方案：


li a{
字体大小：0；/*非常小*/
}
李娜：以前{
内容：“点击”；
字体大小：1rem；/*对于伪文本，重置为1根em*/
}




通常通过负缩进完成，这对搜索引擎优化非常友好；与
可见性相对：隐藏或
显示：无

display: inline-block;
text-indent: -999px;

但是由于您需要在相同元素上使用
：before
pseudo，因此上述操作将无法正常工作，

因此，字体大小可能是一个更好的解决方案：


li a{
字体大小：0；/*非常小*/
}
李娜：以前{
内容：“点击”；
字体大小：1rem；/*对于伪文本，重置为1根em*/
}




您可以使用“可见性”属性，它将折叠（隐藏）href标记的内容，但保持标记内联

css

html

您可以使用visibility属性，它将折叠（隐藏）href标记的内容，但保持标记内联

css

html

如何将文本隐藏在href标记内

只需将
字体大小设置为
0



页面标题
a{
字号：0；
}






如何将文本隐藏在href标记内

只需将
字体大小设置为
0



页面标题
a{
字号：0；
}





这应该可以解决您的问题，只隐藏第1部分、第2部分等

ul li a {
  visibility: hidden;
}
ul li a:before {
  visibility: visible;
}

另一个声明是必需的，或者您的：before文本也是隐藏的。当然，这将保持你的锚完好无损。
这将解决你的问题，只隐藏第1部分、第2部分等

ul li a {
  visibility: hidden;
}
ul li a:before {
  visibility: visible;
}

另一个声明是必需的，或者您的：before文本也是隐藏的。当然，这将保持锚定不变。
您可以使文本颜色与背景颜色相同（本例中为白色）。这样做的好处是，当您将鼠标移到链接空间上时，链接空间仍然存在，保持其可点击性


li a{
颜色：#fff；
}




您可以使文本颜色与背景颜色相同（本例中为白色）。这样做的好处是，当您将鼠标移到链接空间上时，链接空间仍然存在，保持其可点击性


li a{
颜色：#fff；
}




可见性：隐藏；由于伪元素的内容不在DOM中，用户无法选择它（这可能是出于设计），但屏幕阅读器也可能无法访问它。我没有更好的解决方案，但请考虑您的用户，以及他们潜在的困难与内容。由于伪元素的内容不在DOM中，用户无法选择它（这可能是出于设计），但屏幕阅读器也可能无法访问它。我没有更好的解决方案，但请考虑您的用户，以及他们的潜在困难与您的内容。我建议使用<代码>颜色：透明< /代码>如果使用这种方法（如果只是为了节省时间，必须手动分配正确的背景颜色）；但谷歌——可能还有其他搜索引擎——不会欣赏这一点（尽管反对票不是我的）。@DavidThomas为什么？HTML没有改变-我无法想象文本颜色与谷歌相关…从内存中-这就是我没有否决投票的主要原因-谷歌认为“隐藏文本”（例如与背景颜色无法区分的文本）是类似“关键字填充”的东西，“这是一种将潜在关键字添加到页面中的做法，目的是让搜索引擎表现“更好”，或获得更高的评价。@DavidThomas很好，但问题完全在于隐藏文本。如果谷歌足够聪明（很可能是这样），它将识别出隐藏文本的每一种方法；但正如所指出的：否决票与我的评论完全一致；我的评论是我的观点，我完全接受它们可能是对的、错误的或处于模糊的未定义状态。如果使用这种方法，我建议使用
color:transparent
（如果只是为了节省手动指定正确背景色的时间）；但谷歌——可能还有其他搜索引擎——不会欣赏这一点（尽管反对票不是我的）。@DavidThomas为什么？HTML没有改变-我无法想象文本颜色与谷歌相关…从内存中-这就是我没有否决投票的主要原因-谷歌认为“隐藏文本”（例如与背景颜色无法区分的文本）是类似“关键字填充”的东西，“一种将潜在关键字添加到页面中的做法，目的是让搜索引擎对其进行“更好”或更高的评价。@DavidThomas很好，但是
ul li a {
  visibility: hidden;
}
ul li a:before {
  visibility: visible;
}