如何从 a:before 使用 CSS 中删除下划线？

在CSS中给链接添加下划线是很常见的，因为它可以告诉用户该文本是可点击的。但是，有时候你可能希望移除下划线，以达到更美观的效果。本文将介绍如何从a:before使用CSS中删除下划线。

1. 使用 text-decoration 属性

text-decoration 属性可以控制文本的下划线、删除线、以及闪烁线（虽然后者并不常见）。因此，如果你想从 a:before 使用 CSS 中删除下划线，可以使用以下代码：

a:before {
  text-decoration: none;
}

这将移除链接前面的下划线。如果你还想删除链接本身的下划线，可以在a标签上设置：

a {
  text-decoration: none;
}

2. 使用 border-bottom 属性

下划线实际上就是一条位于文本下方的线条，因此你可以使用 border-bottom 属性来移除下划线。你需要将宽度设置为0，线条颜色设置为透明：

a:before {
  border-bottom: 0px solid transparent;
}

这会使链接前面没有下划线。

3. 使用伪元素 ::before 和 ::after

如果你愿意，你可以使用伪元素 ::before 和 ::after 来创建自己的链接下划线，这将使你有更大的灵活性。你可以使用任何你想要的样式，而不仅仅是下划线。为了创建没有下划线的链接，你可以像这样：

a:before {
  content: "";
  display: block;
  height: 0;
  border-bottom: none;
}

这会将伪元素作为块级元素插入，但不会为其添加下划线。

以上是从 a:before 使用 CSS 中删除下划线的三种方法，你可以选择任何一种适合你的情况。