html - Materialise 删除导航背景

Question

我正在尝试在我的站点中获得扩展的导航，如下所示:

<nav class="nav-extended">
  <div class="nav-wrapper">

    <ul id="nav-mobile" class="right hide-on-med-and-down">
      <li><a href="https://www.instagram.com/?hl=nl"><i class="fab fa-instagram"></i></a></li>
      <li><a href="https://www.facebook.com/"><i class="fab fa-facebook-f"></i></a></li>
      <li><a href="https://plus.google.com/discover"><i class="fab fa-google-plus-g"></i></a></li>
      <li><a href="https://twitter.com/?lang=nl"><i class="fab fa-twitter"></i></a></li>
    </ul>
  </div>

  <div class="nav-content">
    <ul class="tabs tabs-transparent">
      <li class="tab"><a href="#">contact us</a></li>
      <li class="tab"><a href="#">blog</a></li>
      <li class="tab"><a href="#">pages</a></li>
      <li class="tab"><a href="#">service</a></li>
      <li class="tab"><a href="#">about us</a></li>
      <li class="tab"><a href="#">home</a></li>
    </ul>
  </div>
</nav>

在此导航中，我试图删除图标所在的上部背景。 Materialise 有一个标准的红色背景，我无法删除。

这是我在 CSS 中尝试的:

background-color: none (!important);
background-color: rgba (0, 0, 0, 0);
opacity

Answer 1

移除第二个背景颜色并移除 !important 周围的括号。

background-color: none !important;