使用href无法在悬停li上更改字体颜色

Question

我希望在悬停整个li标签时更改字体颜色，而不仅仅是悬停a标签。背景颜色应与之前相同（无悬停）无法找到错误的位置。请帮帮我！感谢＆＃39;！小号

＆＃13;

＆＃13;

nav {
  background: #000;
  min-height: 85px;
  position: fixed;
  z-index: 20;
  width: 100%;
  margin-top: 35px;
  transition: 0.35s all ease;
  max-width: 1800px;
}

nav ul {
  float: right;
  text-align: left;
  display: inline;
  margin: 0;
  list-style: none;
  padding: 1rem;
  transition: 0.35s all ease;
}

nav ul li {
  font: 700 18px sans-serif;
  margin-right: -4px;
  position: relative;
  cursor: pointer;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
  letter-spacing: 0.1rem;
  display: inline-block;
  color: white;
  padding: 1rem 2rem;
  text-transform: uppercase;
  /*font-family: sans-serif;*/
}

nav ul li a:hover {
  color: #BD1521;
  transition: 0.35s all ease;
}

nav ul li:hover {
  color: #BD1521;
  transition: 0.35s all ease;
}

nav ul li a {
  text-decoration: none;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1rem;
  color: #fff;
}

＆＃13;

<nav>
  <a href="index.html"><img class="logo" src="assets/svg/logo-foddis-inverse.svg"></a>
  <ul id="menu">

    <li>Leistungen
      <ul class="dropdown">
        <li><a href="#">Reparatur &amp; Instandsetzung</a></li>
        <li><a href="#">Lackierung &amp; Folierung</a></li>
        <li><a href="#">Restauration &amp; Sonderumbau</a></li>
        <li><a href="#">Autoglas &amp; Folie</a></li>
        <li><a href="#">Fahrzeugaufbereitung</a></li>
        <li><a href="#">Service Plus</a></li>
      </ul>
    </li>

    <li>Über Uns
      <ul class="dropdown">
        <li><a href="#">Unternehmen</a></li>
        <li><a href="#">Unser Team</a></li>
        <li><a href="#">Karierre</a></li>
        <li><a href="#">Impressum</a></li>
        <li><a href="#">AGB's</a></li>
        <li><a href="#">Datenschutz</a></li>
      </ul>
    </li>

    <li><a href="#">Kontakt</a></li>
    <li><a href="#"><button class="nav_button"><span>Angebote</span></button></a></li>

    <li class="subbar" style="padding-top: 5px;"><i class="fa fa-clock-o" aria-hidden="true" style="padding-right:10px;"></i>Öffnungszeiten: 9:00-18:00 Uhr</li>
    <li class="subbar"><i class="fa fa-phone" aria-hidden="true" style="padding-right:10px;"></i>176 311 81 41 8</li>
    <li class="subbar"><a href="mailto:example@example.de"><i class="fa fa-envelope" aria-hidden="true" style="padding-right:10px;"></i>example@example.de</a></li>

  </ul>
</nav>

＆＃13;

＆＃13;

＆＃13;

Answer 1

您需要专门更改color上的锚li:hover。

nav ul li:hover a {
color: #BD1521;
transition: 0.35s all ease;
}