Bootstrap 5如何让链接在浅色/深色模式下都不显示为链接样式

方案1：用Bootstrap自带工具类快速实现 #

给目标链接加上两个工具类，直接搞定：

<a href="#" class="text-reset text-decoration-none">和普通文本一样的链接</a>

• text-reset：让链接颜色继承父元素的文本颜色，Bootstrap切换深浅模式时会自动跟着变化
• text-decoration-none：去掉链接默认的下划线

方案2：全局自定义样式（适合全站链接统一修改） #

如果想让所有链接都默认用这个样式，写一段自定义CSS就行，用Bootstrap原生的CSS变量，完全不需要JavaScript：

a {
  color: var(--bs-body-color);
  text-decoration: none;
}

/* 可选：hover状态可按需调整，比如和普通文本hover保持一致 */
a:hover {
  color: var(--bs-body-color);
  text-decoration: underline; /* 不需要的话直接删掉这行 */
}

var(--bs-body-color)是Bootstrap内置的变量，浅色模式下对应默认文本色，深色模式会自动切换成深色主题的文本色，深浅模式切换时完全自动适配。

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