html - 如何将菜单的背景颜色更改为透明？

Question

我有一个菜单，想在桌面 View 中将背景颜色更改为透明。

ul.dropdown-menu li  {
  background-color: transparent !important;
}

<div class="collapse navbar-collapse navbar-ex1-collapse">
  <ul id="menu" class="menu"><li id="menu-item-1496" class="menu-item menu-item-type-post_type menu-item- object-page menu-item-home current-menu-item page_item page-item-19 current_page_item menu-item-has-   children menu-item-1496 dropdown active">
  <a title="Home" href="https://adsler.co.uk/">Home </a>
  <span class="dropdown-toggle shapely-dropdown" data-toggle="dropdown">
    <i class="fa fa-angle-down" aria-hidden="true"></i>
  </span>
    <ul role="menu" class=" dropdown-menu"
    <li id="menu-item-1502" class="fa fa-user menu-item menu-item-type- post_type menu-item-object-page menu-item-1502">
    <a title="Create 
    Adsler Account" href="https://adsler.co.uk/create-account/">Create Adsler Account</a>
    </li>

没用......

Answer 1

使用媒体查询来定位您认为适用于桌面的屏幕尺寸。

例如:

@media screen and (min-width: 1028px) {
  ul.dropdown-menu li  {
    background-color: transparent;
  }
}

这将针对“屏幕”类型的媒体和最小宽度为“1028 像素”的视口(viewport)尺寸。您需要自己试验最小宽度大小。