Bootstrap 4中如何用最少CSS实现无下划线纯文本样式链接

嘿，既然你已经靠Bootstrap的text-dark解决了链接颜色的问题，那要去掉hover时的下划线，直接用Bootstrap自带的实用类就能搞定，根本不用自己写额外的CSS代码~

分两种情况给你说：

• 如果你用的是Bootstrap 5及以上版本：
  给<a>标签同时加上text-decoration-none和hover:text-decoration-none两个类就行。前者负责默认状态下去除下划线，后者专门处理hover状态，确保鼠标移上去也不会出现下划线。
  示例代码：

  <a href="#" class="text-dark text-decoration-none hover:text-decoration-none">这是个看起来像纯文本的链接</a>
  

• 如果是Bootstrap 4版本：
  它没有这种带hover前缀的状态类，但也不用慌——直接给<a>标签加text-decoration-none就够了。因为Bootstrap 4里<a>标签的hover下划线是伪类样式，而text-decoration-none的优先级足够覆盖它，所以默认和hover状态都会保持无下划线。
  示例代码：

  <a href="#" class="text-dark text-decoration-none">这是个看起来像纯文本的链接</a>
  

这样设置之后，链接就和纯文本几乎一模一样：黑色字体、全程无下划线，只有当光标移上去变成指针形态时，才会暴露它的链接属性，完全符合你的需求~

内容的提问来源于stack exchange，提问作者Poogy