javascript - 如何使 FontAwesomeIcon react 在鼠标悬停时不改变颜色

Question

我有一个黑色背景的页面，我在其中使用 React FontAwesome 放置了一个白色图标

<Link to={'/'} className={classes.homeButtonLink}>
  <FontAwesomeIcon icon={faHome} size="2x"/>
</Link>

将鼠标悬停在图标上时变黑，我看不到它。我怎样才能让图标不改变颜色？我已经尝试将 css 应用于图标和链接，但没有成功。

Answer 1

我试过这个code . FontAwesome 图标在鼠标悬停时不会改变颜色。它只会在鼠标单击时改变颜色。你能用给定的代码重现你的行为吗？

import { BrowserRouter, Link } from "react-router-dom";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { faHome } from "@fortawesome/free-solid-svg-icons";

import "./styles.css";

const element = (
  <BrowserRouter>
    <Link to={"/"}>
      <FontAwesomeIcon icon={faHome} size="6x" />
    </Link>
  </BrowserRouter>
);