如何更改导航栏按钮的颜色？

// 导航栏组件
import React from 'react';
import './Navbar.css';

const Navbar = () => {
  return (
    <nav className="navbar">
      <ul>
        <li><a href="#">首页</a></li>
        <li><a href="#">产品</a></li>
        <li><a href="#">关于我们</a></li>
      </ul>
    </nav>
  );
};

export default Navbar;

/* Navbar.css */
.navbar {
  background-color: #333; /* 导航栏背景颜色 */
}

.navbar ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.navbar li {
  display: inline-block;
  margin-right: 10px;
}

.navbar li a {
  color: #fff; /* 导航栏按钮文字颜色 */
  text-decoration: none;
}

.navbar li a:hover {
  color: #ff0000; /* 鼠标悬停时的文字颜色 */
}