在悬停链接上更改 Bootstrap 4 导航栏的颜色答案

【问题标题】：Change color of Bootstrap 4 navbar on hover link在悬停链接上更改 Bootstrap 4 导航栏的颜色
【发布时间】：2022-01-08 19:03:33
【问题描述】：

我想知道如何在将鼠标悬停在链接上时更改颜色

感谢您的建议？

HTML：

<nav>
  <a class="underline" href="welcome.html">./home </a>
  <a class="underline" href="about.html">./about </a>
  <a class="underline" href="projects.html">./projects </a>
  <a class="underline" href="ctf.html">./ctf's</a>
</nav>

我确实通过以下方式解决了它：

a[href] {
  color: #ffff; /* Change this to which color you prefer */
}

在css中

【问题讨论】：

标签： html bootstrap-4

【解决方案1】：

<style>
    .underline:hover {
      color: red !important;  /* for link text color */
      text-decoration: none; /* for delete under line */
    }
</style>

【讨论】：

【解决方案2】：

添加您自己的 css 文件以覆盖引导程序 -> nav a :hover{ color: #yourcolor; }

【讨论】：

【解决方案3】：

也许你可以添加一些css：

<style>
.underline:hover {
  color: red; /* text color */
  background-color: blue;
}
</style>

【讨论】：